使用Object literal更新标记上的图标

时间:2015-11-05 12:49:29

标签: javascript google-maps google-maps-api-3

由于MarkerImage消失了,我不断更新Marker的Icon。

对Marker.setIcon({url:“icon url”,anchor:....})的拳头调用正常,但是当我尝试在具有相同Object文字的同一标记上创建setIcon时,它会抛出此异常在调试器中:

<exception>: Af
message: "not a string"
name: "InvalidValueError"
stack: "Error↵ at Error (native)↵ at new Af (http://maps.googleapis.com/maps-api-v3/api/js/21/10/intl/de_ALL/main.js:26:682)↵ at Bf (http://maps.googleapis.com/maps-api-v3/api/js/21/10/intl/de_ALL/main.js:26:795)↵ at http://maps.googleapis.com/maps-api-v3/api/js/21/10/intl/de_ALL/main.js:28:60↵ at http://maps.googleapis.com/maps-api-v3/api/js/21/10/intl/de_ALL/main.js:28:181↵ at http://maps.googleapis.com/maps-api-v3/api/js/21/10/intl/de_ALL/main.js:28:401↵ at Zh.setIcon (http://maps.googleapis.com/maps-api-v3/api/js/21/10/intl/de_ALL/main.js:31:1423)↵ at $setIcon_6 (0.js:59576:15)↵ at $update_10 (0.js:98065:3)↵ at $liveTimerFireEvent (0.js:113687:7)"
__proto__: c
c: Object
anchor: U
origin: U
size: W
url: "resources/image.png"
__proto__: Object
this: undefined

在例外情况中显而易见,我使用的是版本21/10 有人有类似问题吗? 我很快就用一个字符串而不是一个Icon的对象来测试它,它就像这样......

因为人们在我甚至有机会说它不是简单的js之前就投票了我的问题......这里是未提取的例子......

    /*
     * declare map as a global variable
     */
    var map;

    /*
     * use google maps api built-in mechanism to attach dom events
     */
    google.maps.event.addDomListener(window, "load", function () {

      /*
       * create map
       */
      var map = new google.maps.Map(document.getElementById("map_div"), {
        center: new google.maps.LatLng(33.808678, -117.918921),
        zoom: 14,
        mapTypeId: google.maps.MapTypeId.ROADMAP
      });

      /*
       * create infowindow (which will be used by markers)
       */
      var infoWindow = new google.maps.InfoWindow();

      /*
       * marker creater function (acts as a closure for html parameter)
       */
      function createMarker(options, html) {
        var marker = new google.maps.Marker(options);
        if (html) {
          google.maps.event.addListener(marker, "click", function () {
            infoWindow.setContent(html);
            infoWindow.open(options.map, this);
          });
        }
        return marker;
      }

      /*
       * add markers to map
       */
      var marker0 = createMarker({
        position: new google.maps.LatLng(33.808678, -117.918921),
        map: map,
        icon: { url :  "http://1.bp.blogspot.com/_GZzKwf6g1o8/S6xwK6CSghI/AAAAAAAAA98/_iA3r4Ehclk/s1600/marker-green.png" }
      }, "<h1>Marker 0</h1><p>This is the home marker.</p>");

      var marker1 = createMarker({
        position: new google.maps.LatLng(33.818038, -117.928492),
        map: map
      }, "<h1>Marker 1</h1><p>This is marker 1</p>");

      var marker2 = createMarker({
        position: new google.maps.LatLng(33.803333, -117.915278),
        map: map
      }, "<h1>Marker 2</h1><p>This is marker 2</p>");
        
        setInterval(function(){ marker0.setIcon({ url :  "http://1.bp.blogspot.com/_GZzKwf6g1o8/S6xwK6CSghI/AAAAAAAAA98/_iA3r4Ehclk/s1600/marker-green.png" }); alert("called");}, 3000);
    });
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?v=3&amp;sensor=false"></script>
<div id="map_div" style="height: 400px;"></div>

1 个答案:

答案 0 :(得分:0)

而不是指定您的图标:

marker0.setIcon({ url :  "http://1.bp.blogspot.com/_GZzKwf6g1o8/S6xwK6CSghI/AAAAAAAAA98/_iA3r4Ehclk/s1600/marker-green.png" });

直接使用URL,而不是作为传递给setIcon的结构的属性。这对我有用而不会抛出错误:

marker0.setIcon("http://1.bp.blogspot.com/_GZzKwf6g1o8/S6xwK6CSghI/AAAAAAAAA98/_iA3r4Ehclk/s1600/marker-green.png");