如何使用瓦片坐标谷歌地图填充瓦片内的颜色？

Question

我在谷歌地图上有一个图块叠加层。我想将图块（10,15）着色或填充为红色。我在这里附加了结果应该如何的图像。这是我的代码的链接。https://jsfiddle.net/60fhd57b/3/

function CoordMapType(tileSize) {
 this.tileSize = tileSize;
 }

CoordMapType.prototype.getTile = function(coord, zoom, ownerDocument) {
var div = ownerDocument.createElement('div');
div.innerHTML = coord;
div.style.width = this.tileSize.width + 'px';
div.style.height = this.tileSize.height + 'px';
div.style.fontSize = '10';
div.style.borderStyle = 'solid';
div.style.borderWidth = '1px';
div.style.borderColor = '#AAAAAA';
return div;
};

function initMap() {
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 5,
center: {lat: 41.850, lng: -87.650}
});

  map.overlayMapTypes.insertAt(
  0, new CoordMapType(new google.maps.Size(200, 200)));
 }

Answer 1

这是一个工作示例： https ://jsfiddle.net/60fhd57b/13/

您应该将图像替换为与您列出的示例类似的内容。

它的工作原理是检查当前坐标是否是您指定的坐标

  if(coord.x == 10 && coord.y == 15){
    div.style.backgroundImage = 'url("url to image")'
  }