好的,我有一个用编码折线表示的多边形。我想把它放在地图上,但是不知道语法怎么写。这是我的代码:
setRegion = new google.maps.Polyline({
locations: "}~kvHmzrr@ba\hnc@jiu@r{Zqx~@hjp@pwEhnc@zhu@zflAbxn@fhjBvqHroaAgcnAp}gAeahAtqGkngAinc@_h|@r{Zad\y|_D}_y@swg@ysg@}llBpoZqa{@xrw@~eBaaX}{uAero@uqGadY}nr@`dYs_NquNgbjAf{l@|yh@bfc@}nr@z}q@i|i@zgz@r{ZhjFr}gApob@ff}@laIsen@dgYhdPvbIren@",
levels: "BBBBBBBBBBBBBBBBBBBBBBBBBBBBBBB",
strokeColor: "#FF0000",
strokeOpacity: 0.8,
strokeWeight: 2,
fillColor: "#FF0000",
fillOpacity: 0.35
});
setRegion.setMap(map);
我使用 Polyline 编码工具 创建了它。从同一页中,我获得了如下用法:
编码后的折线将显示在下面的“Encoded Polyline”和“Encoded Levels”字段中。在创建你的google.maps.Polyline时,使用这些值来设置位置和层级
然而,多边形未出现。有人知道出了什么问题吗?
更新
我尝试了这个方法,但是报错信息为:Uncaught TypeError: Cannot read property 'encoding' of undefined
。
<!doctype html>
<html>
<head>
<title>Test</title>
<meta charset="iso-8859-1">
<script type="text/javascript" src="http://maps.google.com/maps/api/js?libraries=geometry&sensor=false"></script>
<style type="text/css">
#map {width:670px;height:600px;}
</style>
<script type='text/javascript'>
function initialize() {
var myLatlng = new google.maps.LatLng(51.65905179951626, 7.3835928124999555);
var myOptions = {
zoom: 8,
center: myLatlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
var map = new google.maps.Map(document.getElementById("map"), myOptions);
var decodedPath = google.maps.geometry.encoding.decodePath("}~kvHmzrr@ba\hnc@jiu@r{Zqx~@hjp@pwEhnc@zhu@zflAbxn@fhjBvqHroaAgcnAp}gAeahAtqGkngAinc@_h|@r{Zad\y|_D}_y@swg@ysg@}llBpoZqa{@xrw@~eBaaX}{uAero@uqGadY}nr@`dYs_NquNgbjAf{l@|yh@bfc@}nr@z}q@i|i@zgz@r{ZhjFr}gApob@ff}@laIsen@dgYhdPvbIren@");
var decodedLevels = decodeLevels("BBBBBBBBBBBBBBBBBBBBBBBBBBBBBBB");
setRegion = new google.maps.Polyline({
locations: decodedPath,
levels: decodedLevels,
strokeColor: "#FF0000",
strokeOpacity: 1.0,
strokeWeight: 2
});
setRegion.setMap(map);
}
function decodeLevels(encodedLevelsString) {
var decodedLevels = [];
for (var i = 0; i < encodedLevelsString.length; ++i) {
var level = encodedLevelsString.charCodeAt(i) - 63;
decodedLevels.push(level);
}
return decodedLevels;
}
</script>
</head>
<body onload="initialize()">
<div id="map"></div>
</body>
</html>