Google Maps 学习笔记(一)2014.06.04
1.<body onload="加载地图的函数" onunload="GUnload()">
2.new GMap2(container,opts) //容器;控制更复杂的地图特性
3.setCenter()和panTo() // GMaps.setCenter(point,zoomlevel,opts) //new GLatLng(纬度,经度);0~17 //GMaps2.panTo(point)
4.GMaps.panBy()//移动相对距离的函数
5.地图类型:普通地图(G_NORMAL_MAP)、卫星地图(G_SATELLITE_MAP)、混合地图(G_HYBRID_MAP) // GMap2.setMapType()
6.控件: GControl()
精简地图控件GSmallMapControl()、完整地图控件GLargeMapControl()、精简缩放控件GsmallZoomControl()、比例尺控件GScaleControl()、地图类型控件GMapTypeControl()
map.addControl(new GSmallMapControl(),position); //参数position用于定义控件在地图上的位置
7.if(GBrowserIsCompatible())
8.定义控件位置 GControlPosition()对象 new GControlPosition(anchor,offset);//anchor:控件位置的参照点,枚举类型 G_ANCHOR_TOP_LEFT、G_ANCHOR_TOP_RIGHT、
G_ANCHOR_ BOTTOM_LEFT、G_ANCHOR_BOTTOM_RIGHT ; offset: new GSize(x,y) ;x:控件相对于参照点的最近水平距离,y:控件相对于参照点的最近垂直距离 单位为像素px
9.new GMarker(point,opts)
10.自定义GMarker()对象
//创建一个无名类
{s
property1:value1;
property2:value2;
...
}
icon属性,GIon()对象;默认G_DEFAULT_ICON;
示例代码:
myICon = new GIon();//创建自定义的GIon
myICon.image = "http://labs.google.com/ridefinder/images/mm_20_green.png";//前景图片
myICon.shadow = "http://labs.google.com/ridefinder/images/mm_20_shadow.png";//阴影图片
myICon.iconSize = new GSize(12,20);//前景图片大小,长*宽
myICon.shadowSize = new GSize(22,20);//阴影图片大小,长*宽
myICon.iconAnchor = new GPoint(6,20);//myIcon 锚定点相对于myIcon图片左上角的像素距离
myICon.infoWindowAnchor = new GPoint(5,1);//信息窗口相对于myIcon图片左上角的像素距离
var marker1 = new GMarker(geoPoint1,{icon:myIcon,title:"把鼠标移上来,看看有什么"});//自定义GmarkerOptions的icon属性//自定义GMarkerOptions的title属性
11.信息框:
GMarker.openInfoWindowHtml(point,content,opts?)//content:HTML字符串;opts:GInfoWindowOptions对象(无名类),可以省略
GMarker.openInfoWindow(content,opts?)//content:DOM对象
代码示例:
var div = document.createElement("div");
div.style.color = "green";
div.innerHTML = "openInfoWindow创建的GInfoWindow";
marker0.openInfoWindow(div);
12.多标签信息窗口
多标签信息窗口GInfoWindowTabs()对象 new GInfoWindowTab(lable,content)//lable为标签名,普通字符串最大长度为10 content:标签内显示的内容(html字符串或dom对象)
对于固定内容的标签数组直接使用“[...]”
var tabs = [new GInfoWindowTab("Tab1","This is tab1"),
new GInfoWindowTab("Tab2","This is tab2"),
]
对于内容需要更新的标签数组,则可以先定义数组,然后赋值。
var tabs = [];
tabs[0] = new GInfoWindowTab("Tab1","This is tab1");
tabs[1] = new GInfoWindowTab("Tab2","This is tab2");
...
tabs[N] = new GInfoWindowTab("TabN","This is tabN");
new Array()的方法定义也是可以的。
13.在GMarker()上显示 GInfoWindowTabs()多标签信息窗口对象
GMarker.openInfoWindowTabsHtml(tabs,opts?)
GMarker.openInfoWindowTabs(tabs,opts?)
注:注意标签内容的宽度,如果不设置宽度,当标签数量较多时,多窗口将发生错位,如下图:

14.关闭信息窗口:closeInfoWindow()
15.移除GControl()控件:removeControl(control)
16.移除GMarker()地标:removeOverlay(overlay) clearOverlays()
17.loadGeoInfo()接口 //服务器端数据调用接口
18.获取服务器端查询结果
异步调用:GXmlHttp对象 GDownloadUrl()函数
(1)使用GXmlHttp对象 :
代码示例:
var request = GXmlHttp.create();//创建GXmlHttp对象
request.open("GET","myfile.txt",true);//打开GXmlHttp true:异步为真
request..onreadystatechange() = function()
{
//判断状态,可根据不同状态做不同的相应,
if(requset.readyState==4)//完全加载的状态4
{
alert(request.responseText);
}
}
request.sent(null);
(2)使用GDownloadUrl()函数 //简化版的异步处理函数,只能使用Get方法,不判断加载状态,只是在完全加载后调用回调函数。
GDownloadUrl(url,onload)//url: onload:完全加载后的回调函数
GDownloadUrl("search.php?q="+q,function(data){
eval(data);//直接用eval执行返回的Javascript字符串
})
Google Maps 学习笔记(一)2014.06.04的更多相关文章
- Google Maps 学习笔记(二)地图天气预报服务 2014.06.04
地图天气预报服务:一,获取天气预报信息:二,解析天气预报信息:三,在地图上加载天气预报信息: Yahoo!提供的天气预报服务采用流行的RSS输出结果,接口地址如下: http://weather.ya ...
- Google Maps 学习笔记(三)
1.GPolyline折线对象和GPolygon多边形对象 html标签中必须包含v="urn:schemas-microsoft--com:vml"的命名空间 <html ...
- 再起航,我的学习笔记之JavaScript设计模式04
我的学习笔记是根据我的学习情况来定期更新的,预计2-3天更新一章,主要是给大家分享一下,我所学到的知识,如果有什么错误请在评论中指点出来,我一定虚心接受,那么废话不多说开始我们今天的学习分享吧! 上回 ...
- google protobuf学习笔记:windows下环境配置
欢迎转载,转载请注明原文地址:http://blog.csdn.net/majianfei1023/article/details/45371743 protobuf的使用和原理,请查看:http:/ ...
- Google Guava学习笔记——基础工具类Preconditions类的使用
Preconditions类是一组静态方法用来验证我们代码的状态.Preconditons类很重要,它能保证我们的代码按照我们期望的执行,如果不是我们期望的,我们会立即得到反馈是哪里出来问题,现在我们 ...
- Google Guava学习笔记——基础工具类Splitter的使用
另一项经常对字符串的操作就是根据指定的分隔符对字符串进行分隔.我们基本上会使用String.split方法: String testString = "Monday,Tuesday,,Thu ...
- Google Guava学习笔记——基础工具类Joiner的使用
Guava 中有一些基础的工具类,如下所列: 1,Joiner 类:根据给定的分隔符把字符串连接到一起.MapJoiner 执行相同的操作,但是针对 Map 的 key 和 value. 2,Spli ...
- Google Guava学习笔记——简介
Google Guava是什么东西?首先要追溯到2007年的“Google Collections Library”项目,它提供对Java 集合操作的工具类.后来Guava被进化为Java程序员开发必 ...
- Google TensorFlow 学习笔记一 —— TensorFlow简介
"TensorFlow is an Open Source Software Library for Machine INtenlligence" 本笔记参考tensorflow. ...
随机推荐
- win7_32位安装MySQL_5.6以及密码修改方法
1.下载mysql: http://www.xiazaiba.com/html/361.html 2.安装 方便起见,全部默认下一步吧,原理一个样,最后安装到: 3.配置环境变量 我这里添加的是 C ...
- Windows的历史zt
原文地址:http://windows.microsoft.com/zh-CN/windows/history#T1=era0 1975–1981:Microsoft 起步 Microsoft 联合创 ...
- 转 批处理 %~dp0的意义
http://nealcai.iteye.com/blog/1685192 http://blog.csdn.net/caz28/article/details/7448677 http://stac ...
- 要不要用STL的问题——真理是越辩越明的~
QtWidgets的维护者 Marc Mutz 有一篇博客比较详尽的介绍了 Qt自己的容器.介绍了何时用什么比较好https://marcmutz.wordpress.com/effective-qt ...
- EOF 空格问题
mysql -u $USER -p${PASSWORD} $DATABASE << EOF >/tmp/dd-$$ 2>/tmp/ddd-$$select *from $TAB ...
- QDialog弹出一个窗口,改变窗口大小
创建一个QT应用 文件->新建文件或项目 Application->Qt Widgets Application 其他下一步 基类选择QDialog 其他下一步 resize() 改变窗口 ...
- Radio Link Failure and Recovery
四种会发生Radio Link Failure的场景 - DL Physical Layer Failure (PDCCH BLER > 10%) - Random Access Probl ...
- java中两个对象间的属性值复制,比较,转为map方法实现
package com.franson.study.util; import java.lang.reflect.InvocationTargetException; import java.lang ...
- Deep Learning(深度学习)学习笔记整理系列之(四)
Deep Learning(深度学习)学习笔记整理系列 zouxy09@qq.com http://blog.csdn.net/zouxy09 作者:Zouxy version 1.0 2013-04 ...
- iOS 导航条的影响
如果是push出来的控制器,self.view的(0,0)点从状态栏下面开始: 如果有present出来的控制器,self.view的(0,0)点包含状态栏: