如何在谷歌地图中绘制圆圈？
如何在谷歌地图中绘制圆圈？
提问于 2014-03-15 13:37:40
我和谷歌地图一起工作，v4 .i需要根据(纬度、纬度、半径)绘制几个不同颜色的圆圈，我能执行吗？
在搜索过程中，我发现了多个代码来显示圆圈，但没有使用subgurim、google、maps.can、one帮助转换这些代码。
var Circle = new google.maps.Circle({ center: birrfeld, radius: 2000, strokeColor: color, strokeOpacity: 1, strokeWeight: 2, fillColor: color, fillOpacity: 0.4 });
Circle.setMap(map);回答 1
Stack Overflow用户
回答已采纳
发布于 2014-03-15 13:51:08
下面是我的代码，我使用了一个数据文件，其中包含了一个长而长的文件，如json。
var latlng;
var marker;
function initialize () {
var mapOptions = {
zoom: 2,
center: new google.maps.LatLng(2.8,2.8),
mapTypeId: google.maps.MapTypeId.TERRAIN
};
var map = new google.maps.Map(document.getElementById("mapCanvas"),mapOptions );
console.log("alex");
$.getJSON("data/canada.json", function(data) {
//console.log(latlngArray);
var populationOptions = {
strokeColor: '#FF0000',
strokeOpacity: 0.2,
strokeWeight: 6,
fillColor: '#FF0000',
fillOpacity: 0.35,
map: map,
center: latlng,
radius: 20000,
}
for (var i = 0; i < data.length; i++) {
populationOptions.center = new google.maps.LatLng(data[i].Latitude,data[i].Longitude);
cityCircle = new google.maps.Circle(populationOptions);
}
});
}
function loadScript() {
var script = document.createElement('script');
script.type = 'text/javascript';
script.src = 'https://maps.googleapis.com/maps/api/js?v=3.exp&?key=AIzaSyB_h_TZ3jVQstD6ieduDF482_kRIyF4y1I&sensor=false&'
+ 'callback=initialize';
document.body.appendChild(script);
console.log("aaa");
}
window.onload = loadScript;html
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
html {height:100%},
body {height:100%;margin:0;padding:0}
</style>
<script src="js/jquery1.9.js"></script>
<script src="js/jquery-ui.js"></script>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script src="js/AlexMap.js"></script>
</head>
<body >
<div id="heatmapArea style="width:1100px; height:900px"></div>
</body>
我使用的数据绘制了加拿大所有气象站的圆圈，无论是官方的还是“观察员计划”的一部分。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/22424528
复制相关文章
相似问题
腾讯云开发者
