Javascript 如何在谷歌地图上绘制配送范围？

我知道如何在我餐厅的网页上添加谷歌地图，但我如何才能获得送货范围（半透明多边形）

以下是一个例子：

---

也许可以在谷歌地图上放一张半透明的图片？但是如何做到这一点呢？

您可以使用google earth绘制一个多边形，然后将其保存到KML文件并加载到google maps api v3上

var myOptions = {
   zoom: 4,
   center: new google.maps.LatLng(-25.363882,131.044922),
   mapTypeId: google.maps.MapTypeId.ROADMAP,
}
var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

kml_layer = new google.maps.KmlLayer('http://code.google.com/apis/kml/documentation/KML_Samples.kml');
kml_layer.setMap(map);

---

在谷歌地图API中，您可以创建覆盖。你需要知道每个顶点的坐标。如果没有，您可以使用来计算它。

多边形是一种方法，通过“event.latLng”单击侦听器来帮助绘制您的区域

请看这里：

---

单击地图将定义多边形顶点，然后可以将其复制到真实地图。删除最后一个逗号并添加一个括号]。

我找到了这个链接，它允许你在谷歌地图上放置可移动的标记，并将html代码粘贴到你的网站上：

谢谢。这个解决方案非常容易使用。非常感谢。我怎样才能改变画布的颜色？对不起，你能更好地解释一下画布是什么意思吗？对不起，我指的是半透明多边形。在您的示例中，它是灰色的。我可以用CSS或者其他方式改变这个颜色吗？是的，我遗漏了很多选项。我在更新的JSFIDLE中添加了一些基本的工具，并查找新的google.maps.Polygon。（strokeColor:#006600）、strokeWeight:4和fillColor:#FF00DD）API参考显示了所有可能的选项。