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就像是一个装载图片的箱子,箱子有多大图片就显示多大,在设置图片的大小的时候最好设置为图片的大小,这样显示的图片就是你想要的了。