Google地图开发总结
原文网址:https://www.cnblogs.com/yincheng/p/google-map.html
googleMap本地化(离线)
Google Map Api 谷歌地图接口整理
Google Maps API V3 之 路线服务
google map API V3控制地图缩放和显示范围
腾讯位置服务API(marker 与google map API 通用,中文,写的较详细,可查看效果)
google地图API实现动画轨迹(二)
SVG 路径
google地图使用JS(较全的实例)
1、控制地图显示范围为中国
2、控制地图的缩放级别
3、异步加载谷歌API
4、等等等
Google map 上做标记,并把标记连接起来 (解决普通marker偏移)
谷歌地图控制圆圈随缩放自适应大小 js
var circleOptions = {
strokeColor:"#95C7F9",
strokeOpacity:1,
strokeWeight:0.5,
fillColor:"#95C7F9",
fillOpacity:0.35,
map:map.map,
center:position
};
map.locateCircle = new google.maps.Circle(circleOptions);
google.maps.event.addListener(map.map, 'zoom_changed', function() {
var p = Math.pow(2, (21 - map.getZoom()));
map.locateCircle.setRadius(p * 1128.497220 * 0.0027);
});
谷歌地图 API 添加形状(事件样例)
Google Map 自定义infowindow样式
Google 地图 API 教程 http://www.runoob.com/googleapi/google-maps-overlays.html
如何删除google maps api v3离线地图的"google"和"使用条款"
google在control.js搜索google_white 将a=new QF(a,Fl("google_white "),new U(64,24))将其替换成a=new QF(a,Fl(""),new U(0,0)),即可消除。
使用条款在control.js文件里搜索 \\u4f7f\\u7528\\u6761\\u6b3e (使用条款的16进制编码,多出一个\,代表一个\\)可以使用http://www.msxindl.com/tools/unicode16.asp该网页进行翻译。
Google 地图 API V3 之控件
- 缩放控件,显示滑块(针对大地图)或“+/-”小按钮(针对小地图),用于控制地图的缩放等级。在非触摸的设备上,该控件默认显示在地图的左上角,而在触摸设备上则显示在左下角。
- 平移控件,显示用于平移地图的按钮。在非触摸的设备上,该控件默认显示在地图的左上角。您还可以使用平移控件对图像进行 45° 旋转(如果可用的话)。
- 比例控件,用于显示地图比例元素。默认情况下,系统不会启用此控件。
- MapType 控件,可让用户在不同的地图类型(例如
ROADMAP
和SATELLITE
)之间进行切换。该控件默认显示在地图的右上角。 - 街景视图控件包含一个街景小人图标,将该图标拖动到地图上即可启用街景视图。该控件默认显示在地图的左上角。
- 旋转控件包含一个较小的圆形图标,可让您旋转包含斜面图像的地图。该控件默认显示在地图的左上角。(有关详情,请参阅 45° 图像。)
- 总览图控件会显示一个简略的总览图,用于在更广阔区域内反映当前的地图视口。该控件默认以折叠状态显示在地图的右下角。
Google 地图 API V3 之事件(addDomListener)
(在程序中)如何抓取Google地图上地名的经纬度?
- /*
- //地图上画五角星
- var map;
- var markersArray = [];
- function initialize() {
- var haightAshbury = new google.maps.LatLng(37.7699298, -122.4469157);
- var mapOptions = {
- zoom: 12,
- center: haightAshbury,
- mapTypeId: google.maps.MapTypeId.ROADMAP
- };
- var goldStar = {
- path: 'M 125,5 155,90 245,90 175,145 200,230 125,180 50,230 75,145 5,90 95,90 z',
- fillColor: "green",
- fillOpacity: 0.8,
- scale: 1,
- strokeColor: "red",
- //
- strokeWeight: 1
- };
- map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);
- google.maps.event.addListener(map, 'click',
- function(event) {
- marker = new google.maps.Marker({
- position: event.latLng,
- icon: goldStar,
- map: map
- });
- marker.setMap(map)
- });
- }
- */