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. ...
随机推荐
- ETL中的数据增量抽取机制
ETL中的数据增量抽取机制 ( 增量抽取是数据仓库ETL(extraction,transformation,loading,数据的抽取.转换和装载)实施过程中需要重点考虑的问 题.在ETL过 ...
- 1.5 外部销售自动创建为内部PR
1.5 外部销售自动创建为内部PR 1.5.1 业务方案描述 外部销售订单登记后,在销售订单录入界面点击一个创建内部申请按钮,自动将外部销售订单创建为内部申请,创建后将不得再次创 ...
- 九度OJ 题目1534:数组中第K小的数字(二分解)
题目链接:点击打开链接 题目描述: 给定两个整型数组A和B.我们将A和B中的元素两两相加可以得到数组C. 譬如A为[1,2],B为[3,4].那么由A和B中的元素两两相加得到的数组C为[4,5,5,6 ...
- openstack之neutron linuxbridge + vlan组网
linuxbridge是和linuxbridge plugin匹配的core agent,主要实现L2层的功能和security group的功能.security group的功能逐渐会被neutr ...
- ADO.NET FOR MySQL帮助类
using System; using System.Collections; using System.Collections.Specialized; using System.Data; usi ...
- xcode UIImageView创建、图片加载、 音频文件播放、 延迟调用
代码创建 /** 创建UIImageView */ UIImageView * imageView=[[UIImageView alloc]init]; /** 设置尺寸位置 */ imageView ...
- 转载:SQL语句Where中使用别名作为判断条件
原文地址:http://www.cnblogs.com/dwfbenben/p/3307941.html 当我们使用某个表达式作为输出的一列时,我们无法再Where条件中直接使用该列作判断条件. ...
- Android入门——UI(2)
介绍SeekBar拖动条控件.ProgressBar进度条控件.DatePicker日历控件.TimePicker时间控件 <?xml version="1.0" encod ...
- T-SQL 基于关系分割字符串
今天晚上学习了下 SQL 基于关系的运算,同时也捉摸着写了个例子,虽然我知道性能不是很好,还有待优化.直接上源代码吧,思路表达出来有点困难,直接贴上代码,如果有人不懂得可以MM 我. declare ...
- headfirst之装饰模式
class A A.hello class B extends A B.hello = A.hello+B 装饰模式:子类对父类想要包装的方法进行重写,使之成为加强版