Google Maps API地图群集图片不会显示

问题描述 投票:-1回答:1

所以我正在建立一个使用谷歌地图api的网站,我正在尝试让标记群集正常工作。我有聚类工作,但图像根本没有显示。如果你仔细观察,你会注意到两个标记之间的数字2

enter image description here

let markers = [];

  // create empty array to hold all story modal windows
  let story_windows = [];

  // loop through the JSON data
  $.each(story, function(key, data) {

    // set the latitude/longitude and create a new LatLng object
    let latLng = new google.maps.LatLng(data.latitude, data.longitude);

    // Create a marker to place on the map
    let marker = new google.maps.Marker({
      // takes a latLng object
      position: latLng,
      // where to place the marker, ie the map
      map: map,
      // what image to use for the marker
      icon: 'markerImage.png',
      // set a pop up title for the marker, use the stories title
      title: data.title
    });

    markers.push(marker);


    // set the modal content with the data from the story
    let modalContent = createModalWindow(data.title, data.image, data.body, data.audio);

    // add the current stories modal window to the array
    story_windows.push(modalContent);

    // append the current story to the menu dropdown and set it's data- values to display the modal
    $("#drop-menu").append(`<a class='dropdown-item' data-index='${key}' data-gps='${latLng}'>${data.title}</a>`);

    // show modal window when marker is clicked
    google.maps.event.addListener(marker, 'click', function() {

      // center map on marker when clicked
      map.panTo(marker.getPosition());

      // set the html content of the modal window
      $("#myModal .modal-content").html(modalContent);

      // show the modal window
      $('#myModal').modal('show');

    }); // end event listener

  }); // end foreach

  // Add a marker clusterer to manage the markers.
  let markerCluster = new MarkerClusterer(map, markers, {imagePath: '/cluster_images/m1.png',});

我只是想使用Google的文档在标记聚类页面上显示的m1.png图像。谁能指出我正确的方向?

api maps markerclusterer
1个回答
0
投票

想出来,看来图像显示你只需要使用他们正在使用的网址。 developers.google.com/maps/documentation/javascript/examples / ...作为图片路径,即使它告诉您下载它们

© www.soinside.com 2019 - 2024. All rights reserved.