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 ...
随机推荐
- (heap)239. Sliding Window Maximum
题目: Given an array nums, there is a sliding window of size k which is moving from the very left of t ...
- linux下添加中文输入法
一.安装环境 查看linux版本号 [ztteng@ztteng ~]$ lsb_release -aLSB Version: :core-4.0-ia32:core-4.0-noarch:gr ...
- ubuntu 16.04 一些使用过程中遇到的问题
1 安装ssh 和 openssh-server之后通过SecureCRT 可以连接,FileZilla不能使用sftp方式进行连接, 安装vsftpd后测试ftp可以连接, 修改 /etc/ssh ...
- spring mvc 安全
1,使用 spring form 标签 防 csrf 攻击 2,标明请求方法:RequestMethod.GET,RequestMethod.POST, PATCH, POST, PUT, and D ...
- 关于java读取和写入properties配置文件的内容
一般通过使用流的方式进行读取 代码示例如下: package com.zznode.transmit.util; import java.io.FileInputStream; import java ...
- 移动支付之智能IC卡与Android手机进行NFC通信
本文来自http://blog.csdn.net/hellogv/ .引用必须注明出处. 眼下常见的智能IC卡执行着JavaCard虚拟机.智能IC卡上能够执行由精简后的Java语言编写 ...
- [Protractor] Running tests on multiple browsers
Testing your AngularJS application on multiple browsers is important, and Protractor offers this abi ...
- hadoop之mapreduse 在Eclipse下的调试环境篇
搭建完毕环境后,開始调试mapreduse程序. 可是遇到不停的报错.本人非常讨厌在自己的操作系统环境变量里设置来设置去,包含linux也是. 通常喜欢把设置环境变量在启动程序的脚本中.让脚本自己执行 ...
- HTML基础知识笔记(一)
HTML定义 HTML指的是超文本标记语言 HTML不是编程语言,而是标记语言 标记语言是一套标记标签 HTML是用标记标签来描述网页 HTML标签1 <html></html& ...
- 文本框脚本 - select 事件
HTML中,用两种方式来表示文本框: input 单行文本.textarea 多行文本 那么在文本中存在哪些事件尼? 1 select 都支持 但是其触发的时机不一样 IE9+ .Safair ...