javascript-geoxml3：如何加载自定义图标

我需要将自定义kml文件加载到Google Map中,相应的资源中的代码几乎没有变化：

function initialize() {
var myLatlng = new google.maps.LatLng(39.397, -100.644);
  var myOptions = {
    zoom: 5,
    center: myLatlng,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  };
  var map = new google.maps.Map(document.getElementById('map_canvas'), myOptions);

  var geoXml = new geoXML3.parser({map: map, processStyles: true});
  geoXml.parse('test.kml');
};

.kml直接来自Google Maps,并且有一堆标记,全部带有自定义图标,例如：

<Style id="sn_1">
    <IconStyle>
        <scale>1.1</scale>
        <Icon>
            <href>http://maps.google.com/mapfiles/kml/paddle/Z.png</href>
        </Icon>
        <hotSpot x="32" y="1" xunits="pixels" yunits="pixels"/>
    </IconStyle>
    <ListStyle>
        <ItemIcon>
            <href>http://maps.google.com/mapfiles/kml/paddle/Z-lv.png</href>
        </ItemIcon>
    </ListStyle>
</Style>

其他图标定义为(现有)本地路径,例如：

<Icon>
<href>img/marker/5.png</href>
</Icon>

但是,尽管地图显示得很好,但没有加载任何图标,相反,我只获得了默认的Google Maps Icons.对此的任何帮助将不胜感激,因为我的JavaScript知识非常有限,而且我觉得我正处在更加头​​痛的困境中,这无助于我…

干杯:)

解决方法:

grigno提供的答案对我来说效果很好,但是KML文件中的所有标记都必须具有这种样式,或者在将函数传递给函数之前检查placemark.style.icon是否未定义：

<Document>
<name>myKml.kml</name>
<Style id="My_Style">
    <IconStyle> 
        <Icon> 
            <href>office-building.png</href>
        </Icon>
    </IconStyle>
</Style>

并在地标部分中：

<Placemark>
   <name><![CDATA[iMEX0011]]></name>
   <description><![CDATA[MARKER TITLE]]></description>
   <styleUrl>#My_Style</styleUrl> 
   <Point>
       <coordinates>-99.2232472,25.4413972,0</coordinates>
   </Point>
</Placemark>

标签：google-maps-api-3,javascript,xml-parsing,geoxml3
来源： https://codeday.me/bug/20191202/2086291.html