在谷歌地图 v2 上绘制多边形

draw polygons on google map v2

本文关键字：绘制 多边形 v2 谷歌地图      更新时间：2023-09-26

我如何使用用户输入的坐标在谷歌地图上绘制多边形。我有两个输入字段（纬度和 lng），当用户单击按钮时，我想绘制多边形。我有这个代码，但它不起作用。谁能帮我？

.HTML：

<form onsubmit="show(this.lat.value, this.lon.value); return false;">
    <p><label>Latituda</label></p>
       <input type="text" size="13" id="latbox2" name="lat" value="">
    <p><label>Longituda</label></p>
       <input type="text" size="13" id="lonbox2" name="lon" value="">                        
    <p><input type="submit" id="button2" value="Show" class="btnsearch" ></p>
</form>

JavaScript： 

function xz() {
    if (GBrowserIsCompatible()){
            map = new GMap2(document.getElementById("map_canvas"));
            map.setCenter(new GLatLng(43.500752, 16.435547), 6);
            map.setUIToDefault();
            map.addMapType(G_SATELLITE_3D_MAP);
            map.enableGoogleBar();
    }
  }
    function show(lat, lon){
        var latOffset = 0.01;
        var lonOffset = 0.01;
        var polygon = new GPolygon([
            new GLatLng(lat, lon - lonOffset),
            new GLatLng(lat + latOffset, lon),
            new GLatLng(lat, lon + lonOffset),
            new GLatLng(lat - latOffset, lon),
            new GLatLng(lat, lon - lonOffset)
        ], "#f33f00", 5, 1, "#ff0000", 0.2);
        map.addOverlay(polygon);
    }

你实际上并没有说这有什么问题，但经过实验，GLatLng（） 确实需要数字而不是字符串。文档确实说要使用数字;输入字段的内容是字符串。

将它们转换为数字似乎有效（尽管缩放 6 意味着多边形非常小）。请注意，我还在末尾添加了一个setCenter()，以便它可见。

var lat = parseFloat(lat);
var lon = parseFloat(lon);

http://jsfiddle.net/csRCd/1/

相关文章：