3

カスタム kml ファイルを Google マップに読み込む必要があります。コードは適切なリソースからほとんど変更されていません。

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 マップから直接取得したもので、多数のマーカーがあり、すべてカスタム アイコンが付いています。次に例を示します。

<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 マップ アイコンのみが表示されます。私のJavaScriptの知識はかなり限られており、これ以上頭を悩ませてもどこにも行けないと感じているので、これに関する助けをいただければ幸いです...

乾杯 :)

4

2 に答える 2

1

私はtisコードで解決しました:

var マーカー = 新しい google.maps.Marker({position:point,icon: placemark.style.icon});

これは完全な初期化です:

        //Construct a geoXML3 parser
        var myParser = new geoXML3.parser({
                map: map, 
                singleInfoWindow:true,
                processStyles: true,
                createMarker:function(placemark){
                    //Constructing marker for each Placemark node, and then add it to the markclustere
                    var point = new google.maps.LatLng(placemark.point.lat, placemark.point.lng);
                    var marker = new google.maps.Marker({position:point,icon: placemark.style.icon});

                    google.maps.event.addListener(marker, "click", function(){
                        //console.log(placemark.name);
                        infoWindow.content = placemark.description;
                        infoWindow.open(map, marker);
                    });

                    markerclusterer.addMarker(marker);
                }
        });
于 2013-04-03T09:10:01.963 に答える