0

カスタム マップのマーカーに苦労しています。地図は正しい場所を中心にしていますが、その場所にマーカーが表示されません。誰かが同じ問題をすでに解決していますか？ご協力ありがとうございました！

  function initialize() {
                var map_canvas = document.getElementById('map_canvas');
                var map_options = {
                    scrollwheel: false,
                    zoom: 16,
                    center: new google.maps.LatLng(51.840164,4.33244),
                    mapTypeId: google.maps.MapTypeId.ROADMAP,
                    mapTypeControl: false,
                    mapTypeControlOptions: {
                        style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR,
                        position: google.maps.ControlPosition.TOP
                    },
                    panControl: false,
                    panControlOptions: {
                        position: google.maps.ControlPosition.TOP_RIGHT
                    },
                    zoomControl: true,
                    zoomControlOptions: {
                        style: google.maps.ZoomControlStyle.LARGE,
                        position: google.maps.ControlPosition.LEFT_CENTER
                    },
                    scaleControl: false,
                    scaleControlOptions: {
                        position: google.maps.ControlPosition.TOP_LEFT
                    },
                    streetViewControl: false,
                    streetViewControlOptions: {
                        position: google.maps.ControlPosition.LEFT_CENTER
                    }
                  }

                var map = new google.maps.Map(map_canvas, map_options)
              }

        function addMarker(feature) {
                  var marker = new google.maps.Marker({
                    position: feature.position,
                    icon: 'locationpointer.png',

                    map: map_canvas
                  });
                }

                var features = [
                  {
                    position: new google.maps.LatLng(51.840164,4.33244),
                  }
                ];

                for (var i = 0, feature; feature = features[i]; i++) {
                  addMarker(feature);
                }




        google.maps.event.addDomListener(window, 'load', initialize);
4

2 に答える 2

0

地図にマーカーを追加できません。marker.setMap(map) を使用するか、マーカーのプロパティを介して渡してください。しかし、あなたのコードでは map と map_canvas 変数はグローバルスコープにありません。これは addMarker 関数がそれを追加してマップできないことを意味します: map_canvas は null です

var marker = new google.maps.Marker({
    position: feature.position,
    icon: 'locationpointer.png',
    **map: map_canvas**
});

マップを addMarker 関数に渡すには、コードを少し変更する必要があります。

于 2013-09-25T15:23:33.807 に答える
0

マップが初期化される前ではなく、初期化された後にマーカーが追加されるように、初期化関数で addMarker 関数を呼び出す必要があります。マーカーのマップ プロパティを初期化するための 2 つのオプションがあります。1. グローバルにするか、2. addMarker 関数に渡します (以下を参照)。また、map_canvas は google.maps.Map ではなく HTML DOM 要素であることにも注意してください。その変数の名前は「map」です。

function initialize() {
  var map_canvas = document.getElementById('map_canvas');
  var map_options = {
                scrollwheel: false,
                zoom: 16,
                center: new google.maps.LatLng(51.840164,4.33244),
                mapTypeId: google.maps.MapTypeId.ROADMAP,
                mapTypeControl: false,
                mapTypeControlOptions: {
                    style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR,
                    position: google.maps.ControlPosition.TOP
                },
                panControl: false,
                panControlOptions: {
                    position: google.maps.ControlPosition.TOP_RIGHT
                },
                zoomControl: true,
                zoomControlOptions: {
                    style: google.maps.ZoomControlStyle.LARGE,
                    position: google.maps.ControlPosition.LEFT_CENTER
                },
                scaleControl: false,
                scaleControlOptions: {
                    position: google.maps.ControlPosition.TOP_LEFT
                },
                streetViewControl: false,
                streetViewControlOptions: {
                    position: google.maps.ControlPosition.LEFT_CENTER
                }
              }

  var map = new google.maps.Map(map_canvas, map_options)

  var features = [
      {
        position: new google.maps.LatLng(51.840164,4.33244),
      }
  ];

  for (var i = 0, feature; feature = features[i]; i++) {
    addMarker(feature, map);
  }
}

function addMarker(feature, map) {
   var marker = new google.maps.Marker({
                position: feature.position,
                icon: 'locationpointer.png',
                map: map
   });
}

google.maps.event.addDomListener(window, 'load', initialize);
于 2013-09-25T15:44:57.550 に答える