在 Polymer 1.0 中动态创建的标记/传单地图在 Firefox 中不呈现

Question

我正在尝试在使用 Polymer 1.0 和传单地图 Web 组件的地图上的按钮单击事件上的特定点添加标记 - github link。我的代码在 Chrome 中按预期工作，但在 Firefox 41.0.1 中出现错误：

"TypeError : t is null"

（引用 leaflet.js 页面），标记不显示。

这里是Javascript，在按钮的注册中：

var parent = document.getElementById('nycmap');
nycmap.setToPoint(locator.latitude, locator.longitude);

var newMarker = document.createElement('leaflet-marker');

var lat1 = locator.latitude;
var long1 = locator.longitude;

var lat = document.createAttribute("latitude");       
lat.value = lat1; 
var longi = document.createAttribute("longitude");       
longi.value = long1; 
newMarker.setAttributeNode(lat);
newMarker.setAttributeNode(longi);
newMarker.id="marker";

Polymer.dom(parent).appendChild(newMarker);

我在 Firefox 中也收到这些警告，但我认为这些不是问题的根源：

Use of document.createAttribute() is deprecated. Use element.setAttribute() instead.
Use of setAttributeNode() is deprecated. Use setAttribute() instead.

（我不明白如何使用element.setAttribute创建元素，但这是另一个问题）。

Answer 1

你把事情搞混了。使用 setAttribute 足以满足您的需求。您需要在刚刚使用 document.createElement 创建的元素上调用它。如果您想要此 HTML:

<leaflet-marker id="marker" latitude="0" longitude="0"></leaflet-marker>

您需要创建一个元素并向其添加三个属性：

var marker = document.createElement('leaflet-marker')

marker.setAttribute('id', 'marker')
marker.setAttribute('latitude', locator.latitude)
marker.setAttribute('longitude', locator.longitude)

Polymer.dom(parent).appendChild(marker)

在 Polymer 1.0 中动态创建的标记/传单地图在 Firefox 中不呈现

dynamically created marker in Polymer 1.0 / leaflet-map does not render in Firefox

javascript

firefox

element

leaflet

polymer-1.0