这里仅仅是将谷歌地图API的使用方法告诉大家,算是抛砖引玉吧,由于某些原因,谷歌已经远离大家了。
<!DOCTYPE html>
<html>
<head>
<title>GeoLocation</title>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
<style>
html, body, #map-canvas {
margin: 0;
padding: 0;
height: 100%;
}
</style>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
<script>
var map;
var poly;
function initialize() {
var myLatlng = new google.maps.LatLng(31.1937077, 121.4158436);
var locations = [
['test1, accuracy: 150m', 31.1937077, 121.4158436, 100],
['test2, accuracy: 150m', 31.2937077, 121.4158436, 100],
['test3, accuracy: 150m', 31.0937077, 121.2158436, 100],
['test4, accuracy: 150m', 31.3937077, 120.4158436, 100],
['test5, accuracy: 150m', 31.1637077, 120.4858436, 100],
['test6, accuracy: 150m', 31.1037077, 121.5158436, 100]
];
var mapOptions = {
zoom: 13,
center: myLatlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById('map-canvas'),
mapOptions);
// 线条设置
var polyOptions = {
strokeColor: '#00ff00', // 颜色
strokeOpacity: 1.0, // 透明度
strokeWeight: 4 // 宽度
}
poly = new google.maps.Polyline(polyOptions);
poly.setMap(map); // 装载
/* 循环标出所有坐标 */
/*for(var i=0; i<locations.length; i++){
var loc = [];
loc.push(locations[i][1]);
loc.push(locations[i][2]);
var path = poly.getPath(); //获取线条的坐标
path.push(new google.maps.LatLng(loc[0], loc[1])); //为线条添加标记坐标
//生成标记图标
marker = new google.maps.Marker({
position: new google.maps.LatLng(loc[0], loc[1]),
map: map
// icon: "https://maps.gstatic.com/mapfiles/markers/marker_green.png"
});
}*/
var marker, i, circle;
var iwarray = [];
var infoWindow;
var latlngbounds = new google.maps.LatLngBounds();
var iconYellow = new google.maps.MarkerImage("http://maps.google.com/mapfiles/ms/icons/yellow-dot.png");
for (i = 0; i < locations.length; i++) {
var loc = [];
loc.push(locations[i][1]);
loc.push(locations[i][2]);
var path = poly.getPath(); //获取线条的坐标
path.push(new google.maps.LatLng(loc[0], loc[1]));
var latlng = new google.maps.LatLng(locations[i][1], locations[i][2]);
latlngbounds.extend(latlng);
if (locations[i][0].indexOf("[Cached") == 0 || (locations[i][0].indexOf("[Multiple") == 0 && locations[i][0].indexOf("[Cached") >= 0 )) {
marker = new google.maps.Marker({
position: latlng,
map: map,
icon: iconYellow
});
var iw = '<div style="font-size: 12px;word-wrap:break-word;word-break:break-all;"><strong><font color="#FF0000">' + locations[i][0] + '<font></strong><div>';
} else {
marker = new google.maps.Marker({
position: latlng,
map: map
});
var iw = '<div style="font-size: 12px;word-wrap:break-word;word-break:break-all;"><strong><font color="#000000">' + locations[i][0] + '<font></strong><div>';
}
iwarray[i] = iw;
google.maps.event.addListener(marker, 'mouseover', (function(marker,i){
return function(){
infoWindow = new google.maps.InfoWindow({
content: iwarray[i],
maxWidth: 200,
pixelOffset: new google.maps.Size(0, 0)
});
infoWindow.open(map, marker);
}
})(marker,i));
google.maps.event.addListener(marker, 'mouseout', function() {
infoWindow.close();
});
circle = new google.maps.Circle({
map: map,
radius: locations[i][3],
fillColor: '#0000AA',
fillOpacity: 0.01,
strokeWeight: 1,
strokeColor: '#0000CC',
strokeOpacity: 0.8
});
circle.bindTo('center', marker, 'position');
}
map.fitBounds(latlngbounds);
var listener = google.maps.event.addListenerOnce(map, "idle", function()
{
var zoomLevel = parseInt(map.getZoom());
if (zoomLevel > 13)
map.setZoom(13);
});
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<body>
<div id="map-canvas"></div>
</body>
</html>
我有一个从Google maps下载静态图像的应用程序,将标记放置在我想要的位置(通过将参数传入Google static maps URL来放置)。但是,我也需要能够点击标记。我想我可以将x和y坐标转换为lon/lat,然后用这种方法计算出哪个标记被点击了,但我发现这并不容易。 我知道地图的尺寸(以像素为单位),缩放级别,以及地图的中心点(以像素和lon/lat为单位),所以我跟踪了这篇博文。不
我有一堆标记,我可以在其中加载到谷歌地图上。我的问题是,相机不在标记之上。我可以将它集中在我所有的标记之上吗? 我正在使用以下代码添加标记: 我在堆栈上看了看,发现了这个问题,和我的问题一样: Android谷歌地图API V2中心标记 但它背后没有太多的背景,也不知道如何实现它。
我正在用html/jsp页面主体中的Google地图做一个web动态项目。 我制作了一个函数,可以创建一个标记(lat、lng、map),并在标记的参数中使用一个特殊的image.png作为图标。 在我的地图中,我制作了两种不同的样式(地图的颜色…)“白天”和“夜晚”。 我想知道当用户点击夜间更改样式时,我如何更改标记的图标。事实上,标记的颜色不适合这种风格的地图... 我尝试用相同的名称初始化不
我调用API,然后将JSON数据添加到arraylist中,然后调用arraylist数据,并将纬度和经度放置在地图上,放置多个标记。我相信我的问题是从ArrayList获取字符串,但我不知道如何解决它。 我正在从另一个类调用API 私有GoogleMap mMap;
我已经添加了片段活动地图,并使用addMarker函数添加了几个标记,但我能够删除所有标记,我收到了不同标记列表的通知, 现在我想删除所有标记并添加新标记。 一种将所有标记保留在列表中并逐个删除的方法,(marker.remove()) 有没有更好的方法清除所有标记。
试图制作一个小的Android应用程序,以谷歌地图标记的形式显示人们的位置。 当用户按下按钮出现在地图上时,应用程序会从Firebase JSON中检索用户数据并在地图上实时显示用户。如果用户移动,标记会随着他一起移动(当他的位置发生变化时删除并重新创建)。 一切都很好,除了当用户按下离开地图时,他的标记会保留在所有其他手机中,即使它已从Firebase JSON中删除。 有人能解释一下如何解决这