0

我使用 Google Fusion Tables 创建了一张地图，并将地图上传到了 HTML 文档中，我正在对其进行调整以对地图的外观进行细微的更改。我想出了如何插入一个可拖动的图钉/标记，在点击时显示其当前位置的街景，但我不知道如何更改标记的外观。这是我用于交互式街景标记的代码。

        //street view pin
        var contentString = '<div id="content" style="width:500px;height:400px;"></div>';
        var infowindow = new google.maps.InfoWindow({
        content: contentString
        });

        var marker = new google.maps.Marker({
        position: latlng,
        map: map,
        title: 'Click Here for Street View',
        draggable: true
        });

        google.maps.event.addListener(marker, 'click', function() {
        infowindow.open(map, marker);
        });

        var pano = null;
        google.maps.event.addListener(infowindow, 'domready', function() {
        if (pano != null) {
        pano.unbind("position");
        pano.setVisible(false);             }
        pano = new google.maps.StreetViewPanorama(document.getElementById("content"), {
        navigationControl: true,
        navigationControlOptions: {style: google.maps.NavigationControlStyle.ANDROID},
        nableCloseButton: false,
        addressControl: false,
        linksControl: false
        });
        pano.bindTo("position", marker);
        pano.setVisible(true);
        });

        google.maps.event.addListener(infowindow, 'closeclick', function() {
        pano.unbind("position");
        pano.setVisible(false);
        pano = null;
        });

我试图调整第 7-14 行，添加一个

    icon: 'cross_hairs_highlight'

这是我想要的样式，但是当我尝试在浏览器中打开 HTML 文档时，图标消失了。仍然有一些东西我仍然可以拖动并单击街景，但它是不可见的。

有什么建议么？

感谢您的帮助！！！

JH

4

1 回答 1

1

的值icon应该是 URL，而不是fusionTable-icon的名称（这些图标名称只能用于在 fusionTableLayer 中呈现的标记）。

您将在http://kml4earth.appspot.com/icons.html找到这些图标的列表（检查图像属性以检索 URL） ，因此您可以使用例如：

icon:'http://maps.google.com/mapfiles/kml/pal3/icon52.png'

当您希望标记在给定位置居中时，您还必须指定锚点：

icon:{
       url:    'http://maps.google.com/mapfiles/kml/pal3/icon52.png',
       anchor: new google.maps.Point(16,16)
     }
于 2013-06-05T02:55:43.427 回答