Question

如果用icon1设置了标记，然后又用icon2和icon1连续两次调用setIcon，那么该标记最终将显示为icon2。

marker.setIcon(icon1);

// Then later on:

marker.setIcon(icon2);
marker.setIcon(icon1);

// marker is displayed with icon2

我的解释是，icon2尚未从服务器加载，并且在图像加载完成后，异步地更新了标记。

除了先预载我的所有图标（这在我的项目中会很繁琐，因为许多图标的动态名称取决于地图上数据的内容），还有一种方法可以在Google Maps js API方面进行处理？

更新：here is the code to reproduce it。

谢谢

Answer 1

Your implementation seems to be making a race condition with changing markers as it is an async process,I'd recommend using the data layer instead and use the dynamic styling to set the marker based on a data attribute.

function initMap() {
  const myLatLng = new google.maps.LatLng(45.4375, 12.3358);
  const myOptions = {
    zoom: 5,
    center: myLatLng,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  };
  let map = new google.maps.Map(document.getElementById('map-canvas'), myOptions);
  const point = {
    geometry: myLatLng,
    id: 1,
    properties: {
      warn: false
    }
  };
  dl = new google.maps.Data({map: map});
  console.log("Adding feature:");
 	console.log(point);
  dl.setStyle(setStyle);
  dl.add(point);
  dl.addListener('mouseover', e => {
  	e.feature.setProperty("warn", true);
  });
	 dl.addListener('mouseout', e => {
  	e.feature.setProperty("warn", false);
  });
}

function setStyle(feature) {
	console.log('setting style for feature');
	const warn = feature.getProperty('warn');
  let icon = 'https://maps.google.com/mapfiles/kml/pushpin/ylw-pushpin.png';
	if (warn) {
  	icon = 'https://maps.google.com/mapfiles/kml/shapes/caution.png';
  }
  const style = {
  	title: feature.getId(),
  	icon: icon
  };
  console.log("style = " + style);
  return style;
}

#map-canvas {
    height: 600px;
    width: 600px;
    background-color: #CCC;
}

<div id="map-canvas"></div>
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAj0aaMu_aY6xiDSWH0ac_4pqN_l-opwmI&callback=initMap"
    async defer></script>

Answer 2

您可以尝试使用<?php namespace MyProject\Repository; abstract class PersonRepository { public function getSomething($someProperty) { //Desire is to return both Employees and Owners return $this->findBy(['someProperty'=>$someProperty]); } } class EmployeeRepository extends PersonRepository { public function getSomething($someProperty) { if($someProperty==123) { //Do something } else return parent::getSomething($someProperty); } }进行切换。我已经通过使用marker.setVisible()调用函数解决了gmap的一些奇怪之处，但这只是另一个解决方法。

快速调用地图标记setIcon会造成问题

2 个答案: