Polymer 1.0/传单地图中动态创建的标记不会在Firefox中渲染

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

本文关键字：Firefox 创建 动态 单地图 Polymer 地图      更新时间：2023-09-26

我正在尝试使用Polymer 1.0和传单地图web组件-github链接在地图上的按钮点击事件上的特定点添加标记。我的代码在Chrome中正常工作，但在Firefox 41.0.1中我得到了一个错误：

"TypeError:t为空"

（引用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创建元素，但这是另一个问题）。

你把事情搞混了。使用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)
  • https://developer.mozilla.org/en-US/docs/Web/API/Document/createElement
  • https://developer.mozilla.org/en-US/docs/Web/API/Element/setAttribute
相关文章：