Google API v3 设置Icon问题处理
1、查看API实现
//虽然比较符合API实现的思想但这个没法;
//会产生Uncaught TypeError: undefined is not a function
//google API no example to using it
var icon = new google.maps.Icon({
anchor:new google.maps.Point(0,0),
origin:new google.maps.Point(0,0),
scaledSize: new google.maps.Size(10,10),
size: new google.maps.Size(10,10),
url:"http://maps.google.com/mapfiles/kml/paddle/purple-square.png"
});
再次尝试,又能肿么的
// the same problem
//Uncaught TypeError: undefined is not a function
//no construction !!!!my dear
function getIconByUrl(imgurl,size..){
var icon=new google.maps.Icon();
icon.url=imgurl;
icon.......
}
调用不成功,好悲催的一段经历!!!
2、查找解决方案
最终在:http://stackoverflow.com/questions/14679696/failed-to-instantiate-google-maps-icon 找到答案(get solution)。
var image = {url: 'https://developers.google.com/maps/documentation/javascript/examples/images/beachflag.png',
size: new google.maps.Size(20, 32),
origin: new google.maps.Point(0,0),
anchor: new google.maps.Point(0, 32)}; var marker = new google.maps.Marker({
position: myLatLng,
map: map,
icon: image,
});
3、最终实现的可用的ICON获取方法
function getIcon(imageUrl,size){
var imgSize=size||32;
var offSize=imgSize/2;
var defaultSize=new google.maps.Size(imgSize, imgSize);
var myIcon={
url: imageUrl,
size: defaultSize,
scaledSize:new google.maps.Size(imgSize,imgSize),
origin: new google.maps.Point(0,0),
anchor: new google.maps.Point(offSize,offSize)
};
return myIcon;
}
注意(notice):The scaledSize like a box's size ,we can use it to load a image.When you set the image's size better set the size as same as the scaledSize which you want ! 即 scaledSize就像是一个装载图片的箱子,箱子有多大图片就显示多大,在设置图片的大小的时候最好设置为图片的大小,这样显示的图片就是你想要的了。
Google API v3 设置Icon问题处理的更多相关文章
- Google Map API V3开发(6) 代码
Google Map API V3开发(1) Google Map API V3开发(2) Google Map API V3开发(3) Google Map API V3开发(4) Google M ...
- Google 地图 API V3 之 叠加层
Google官方教程: Google 地图 API V3 使用入门 Google 地图 API V3 针对移动设备进行开发 Google 地图 API V3 之事件 Google 地图 API V3 ...
- Google Maps API V3 之绘图库 信息窗口
Google官方教程: Google 地图 API V3 使用入门 Google 地图 API V3 针对移动设备进行开发 Google 地图 API V3 之事件 Google 地图 API V3 ...
- Google Maps API V3 之 路线服务
Google官方教程: Google 地图 API V3 使用入门 Google 地图 API V3 针对移动设备进行开发 Google 地图 API V3 之事件 Google 地图 API V3 ...
- Google map API V3
本文主要总结Google map API V3使用中最简单也是最常见的一些操作以及相关概念,如果需要更加详细的信息,请直接阅读Google提供的关于map的文档. google map api v3文 ...
- Google Map API V3开发(3)
Google Map API V3开发(1) Google Map API V3开发(2) Google Map API V3开发(3) Google Map API V3开发(4) Google M ...
- Google Map API V3开发(5)
Google Map API V3开发(1) Google Map API V3开发(2) Google Map API V3开发(3) Google Map API V3开发(4) Google M ...
- Google 地图 API V3 使用入门
Google官方教程: Google 地图 API V3 使用入门 Google 地图 API V3 针对移动设备进行开发 Google 地图 API V3 之事件 Google 地图 API V3 ...
- Google 地图 API V3 针对移动设备进行开发
Google官方教程: Google 地图 API V3 使用入门 Google 地图 API V3 针对移动设备进行开发 Google 地图 API V3 之事件 Google 地图 API V3 ...
随机推荐
- Hdu5785-Interesting(回文串处理)
Problem Description Alice get a string S. She thinks palindrome string is interesting. Now she wanna ...
- OpenstackHigh-level-service
1,yum -y install openstack-cinder;
- hdu 5033 Building (单调栈 或 暴力枚举 )
Description Once upon a time Matt went to a small town. The town was so small and narrow that he can ...
- C# yield return 流程理解
代码如下: 在Documents1方法中使用yield return之后, 下次在进入Documents1方法就是从上一次yield return部分执行 using System; using S ...
- spring + jdbc + extjs configuration
所有源代码能够訪问我的GitHub 有空没空的稻谷了几天,最终前后台跑通了,提供一套可用的配置文件. (因为与extjs整合,spring security的登录须要重写原handler.会在后面补上 ...
- 零拷贝概念 -- linux内核
零拷贝(zero-copy) 备快速网络接口的主要技术. 零拷贝技术通过降低或消除关键通信路径影响速率的操作,降低传输数据的操作系统开销和协议处理开销,从而有效提高通信性能,实现快速传输数据. 零拷贝 ...
- Linux 内核开发 - 进程空间
1.1 虚拟内存 Linux 的系统.假设每一个任务都独立的占用内存,则实际的物理内存将非常快消耗殆尽.实际上对于前台正在执行的任务来说,所须要要的内存并不多,非常多任务基本不须要执行,也就没有必要一 ...
- iOS ARC注释和错误的解决方法在使用
1.一个错误The current deployment target does not support automated __weak references 这个错误被所述支持iOS版本号不支持相 ...
- 本博客弃用,请移步http://ningios.com查看最新
本博客弃用,请移步http://ningios.com查看最新
- javascript操作json总结
原文:http://www.cnblogs.com/worfdream/articles/1956449.html JSON(JavaScript Object Notation) 是一种轻量级的数据 ...