google map v3 使用自定义Marker在地图上添加文字标签
& 网上找了好久都是v2版本，没办法看看api吧。上面只有自定义叠加层，没有发现重写marker的功能。&&& 没办法，就用api的自定义叠加层吧。虽然可以实现带字的标记了，但是它没有marker那么多的功能，如果
&& 你javascript可以继续填充功能。&&& 使用的时候就调用这句话
Js代码 &overlay&=&new&MyMarker(map,{latlng:new&google.maps.LatLng(0,&-180),image:&googlemap/images/alarm.gif&,clickFun:zoomOut});&&&&&
Js代码 &/***************自定义叠加层，可作为站点显示在地图上******************/&&&&&&function&MyMarker(map,&options)&{&&&&&&&&&&&//&Now&initialize&all&properties.&&&&&&&&&&&this.latlng&=&options.&//设置图标的位置&&&&&&&&this.image_&=&options.&&//设置图标的图片&&&&&&&&this.labelText&=&options.labelText&||&&标记&;&&&&&&&&this.labelClass&=&options.labelClass&||&&shadow&;//设置文字的样式&&&&&&&&this.clickFun&=&options.clickFun&;//注册点击事件&&&&//&&&&this.labelOffset&=&options.labelOffset&||&new&google.maps.Size(8,&-33);&&&&&&&&this.map_&=&&&&&&&&&&&&&&&this.div_&=&null;&&&&&&&&&&&//&Explicitly&call&setMap()&on&this&overlay&&&&&&&&&&&this.setMap(map);&&&&&&&}&&&&&&&MyMarker.prototype&=&new&google.maps.OverlayView();&&&&&&//初始化图标&&&&&&MyMarker.prototype.onAdd&=&function()&{&&&&&&&&&&&&&&//&Note:&an&overlay&s&receipt&of&onAdd()&indicates&that&&&&&&&&&&&&//&the&map&s&panes&are&now&available&for&attaching&&&&&&&&&&&&&//&the&overlay&to&the&map&via&the&DOM.&&&&&&&&&&&&&&//&Create&the&DIV&and&set&some&basic&attributes.&&&&&&&&&&&&var&div&=&document.createElement(&DIV&);&//创建存放图片和文字的div&&&&&&&&&&div.style.border&=&&none&;&&&&&&&&&&&&&div.style.borderWidth&=&&0px&;&&&&&&&&&&&&&div.style.position&=&&absolute&;&&&&&&&&&&div.style.cursor&=&&hand&;&&&&&&&&&&div.onclick&=&this.clickFun&||function(){};//注册click事件，没有定义就为空函数&&&&&&&&&&//&Create&an&IMG&element&and&attach&it&to&the&DIV.&&&&&&&&&&&&var&img&=&document.createElement(&img&);&//创建图片元素&&&&&&&&&&img.src&=&this.image_;&&&&&&&&&&&&img.style.width&=&&100%&;&&&&&&&&&&&&&img.style.height&=&&100%&;&&&&&&&&&&&&//初始化文字标签&&&&&&&&&&var&label&=&document.createElement(&div&);//创建文字标签&&&&&&&&&&&&&&label.className&=&this.labelC&&&&&&&&&&&&&&label.innerHTML&=&this.labelT&&&&&&&&&&&&&&label.style.position&=&&absolute&;&&&&&&&&&&&&&&label.style.width&=&&200px&;&&&&&&&&&&//&&label.style.fontWeight&=&&bold&;&&&&&&&&&&&&&&label.style.textAlign&=&&left&;&&&&&&&&&&&&&&label.style.padding&=&&2px&;&&&&&&&&&&&&&&label.style.fontSize&=&&10px&;&&&&&&&&&&//&&label.style.fontFamily&=&&Courier&New&;&&&&&&&&&&&&div.appendChild(img);&&&&&&&&&&&&&div.appendChild(label);&&&&&&&&&&&&&&&&&&&&&&&this.div_&=&&&&&&&&&&&&&&//&We&add&an&overlay&to&a&map&via&one&of&the&map&s&panes.&&&&&&&&&&&&//&We&ll&add&this&overlay&to&the&overlayImage&pane.&&&&&&&&&&&&var&panes&=&this.getPanes();&&&&&&&&&&&&panes.overlayLayer.appendChild(div);&&&&&&&&&}&&&&&&&&//绘制图标，主要用于控制图标的位置&&&&&&MyMarker.prototype.draw&=&function()&{&&&&&&&&&&&&&&&&//&Size&and&position&the&overlay.&We&use&a&southwest&and&northeast&&&&&&&&&&&&&&&//&position&of&the&overlay&to&peg&it&to&the&correct&position&and&size.&&&&&&&&&&&&&&//&We&need&to&retrieve&the&projection&from&this&overlay&to&do&this.&&&&&&&&&&&&&&var&overlayProjection&=&this.getProjection();&&&&&&&&&&&&&&&//&Retrieve&the&southwest&and&northeast&coordinates&of&this&overlay&&&&&&&&&&&&&&//&in&latlngs&and&convert&them&to&pixels&coordinates.&&&&&&&&&&&&&&//&We&ll&use&these&coordinates&to&resize&the&DIV.&&&&&&&&&&&&&&var&position&=&overlayProjection.fromLatLngToDivPixel(this.latlng);&&&//将地理坐标转换成屏幕坐标&&&&&&&&&&//&&var&ne&=&overlayProjection.fromLatLngToDivPixel(this.bounds_.getNorthEast());&&&&&&&&&&&&&&&&//&Resize&the&image&s&DIV&to&fit&the&indicated&dimensions.&&&&&&&&&&&&&&&var&div&=&this.div_;&&&&&&&&&&&&&&div.style.left&=position.x-5&+&&px&;&&&&&&&&&&&&&&div.style.top&&=position.y-5&+&&px&;&&&&&&&&&&&&//控制图标的大小&&&&&&&&&&&&div.style.width&=&&10px&;&&&&&&&&&&&&&&div.style.height&=&10px&;&&&&&&&&}&&&&&&MyMarker.prototype.onRemove&=&function()&{&&&&&&&&&&&&&&&this.div_.parentNode.removeChild(this.div_);&&&&&&&&&&&&&&&this.div_&=&null;&&&&&&&&&}&&&&&&&&&&//Note&that&the&visibility&property&must&be&a&string&enclosed&in&quotes&&&&&&&MyMarker.prototype.hide&=&function()&{&&&&&&&&&&&&&&&if&(this.div_)&{&&&&&&&&&&&&&&&&&&&this.div_.style.visibility&=&&hidden&;&&&&&&&&&&&&&&&}&&&&&&&&&}&&&&&&&&MyMarker.prototype.show&=&function()&{&&&&&&&&&&&&&&&if&(this.div_)&{&&&&&&&&&&&&&&&&&this.div_.style.visibility&=&&visible&;&&&&&&&&&&&&&&&}&&&&&&&&&}&&&&&&&&&//显示或隐藏图标&&&&&&MyMarker.prototype.toggle&=&function()&{&&&&&&&&&&&&&if&(this.div_)&{&&&&&&&&&&&&&&&&&&&if&(this.div_.style.visibility&==&&hidden&)&{&&&&&&&&&&&&&&&&&&&&&this.show();&&&&&&&&&&&&&&&&&&&}&else&{&&&&&&&&&&&&&&&&&&&&&this.hide();&&&&&&&&&&&&&&&&&&&}&&&&&&&&&&&&&}&&&&&&&&}&&&
请各位遵纪守法并注意语言文明有个问题：给 map 添加了 click 事件监听（用于添加 marker），然后给 marker 也添加了 click
事件监听（用于打开 infoWindow）。现在如果点击添加的 marker，infoWindow会打开，但是
infoWindow打开的同时会触发 map 的 click 事件在地图上添加一个点。我想应该是因为百？度没有区分点击的是地图还是地图覆盖物有没有解决的办法，会的朋友请指点下&&
地图的click事件，有这样一个返回值 event{type, target, point, pixel, overlay}
，你可以判断一下，当返回值是overlay的时候，就是说，点到的是地图上的覆盖物，而不是地图，你就直接return，不要添加marker了。
customMarker.addEventListener("click", function(){&&&& alert("您点击了标注");&& });
customMarker这个是你自己定义的覆盖物。
阅读(...) 评论()后使用快捷导航没有帐号？
暂时没有人问过相似的问题，你可以做第一个提问题的人
查看: 2824|回复: 11
如何设置Marker图标的位置
我使用MarkerOptions markerOptions = new MarkerOptions().position(latLng).icon(BitmapDescriptorFactory.fromBitmap(Bitmap));在地图上设置了一个Marker图标，Marker图标是一张图片（下图的正方形），& & & & & & & & & & & & & & & & & & & & & & & &
Marker示例.jpg (2.6 KB, 下载次数: 2)
12:59 上传
A点是该图标的中心点，B点是该图标的下边缘的中点，我想知道通过上面position(latLng)设置的latLng坐标设置的是哪个点啊？如果设置的是B点，那么如何能设置成A点？多多谢各位大神的指点啊！！！
请查看API文档
请查看API文档http://wiki./cms/androidsdk/doc/v3_4_0/
我看过了，文档上说position()方法设置的是Marker坐标的位置坐标，我想知道这个位置坐标是上图中的A点还是B点？求解啊！！！谢谢！
请查看API文档http://wiki./cms/androidsdk/doc/v3_4_0/
我也是这个问题，可以讲解一下吗
楼主解决了没有啊，我也是这个问题，困扰许久了
楼主解决了没有啊，我也是这个问题，困扰许久了
没有啊，之前一直没注意这个问题，昨天刚注意到。
没有啊，之前一直没注意这个问题，昨天刚注意到。
有一个可以设置锚点的函数
有一个可以设置锚点的函数
大哥，说话说完整好不撒，这个可以设置锚点的函数是哪个啊？急用啊！！！多多谢啦！！！
有一个可以设置锚点的函数
请问您说的可以设置锚点的函数是什么函数？急用啊！谢谢啦！
请问您说的可以设置锚点的函数是什么函数？急用啊！谢谢啦！
public void setAnchor(float anchorX,float anchorY)
设置 Marker 覆盖物的锚点比例，默认（0.5f, 1.0f）水平居中，垂直下对齐
public void setAnchor(float anchorX,float anchorY)
设置 Marker 覆盖物的锚点比例，默认（0.5f, 1.0f ...
谢谢啦，按照你说的找到哪个方法了，多多谢啦！！！
楼主解决了没有啊，我也是这个问题，困扰许久了
用Marker.setAnchor(float,float)方法可以设置Marker图标的中心点
Powered by【Leafletjs】2.添加marker到地图
时间： 16:32:46
&&&& 阅读：318
&&&& 评论：
&&&& 收藏：0
标签：&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&Leaflet Marker API地址
/reference.html#marker
接着上篇我们在地图中添加一个marker，非常简单只需添加如下代码即可：
var marker = L.marker([30, 118])
.addTo(map);
给这个marker添加一个弹出框
var marker = L.marker([30, 118])
.addTo(map)
.bindPopup("&b&中国&/b&&br&安徽黄山.")
.openPopup();
结果如下：
设置Marker相关属性项：
{draggable: true, // 使图标可拖拽
title: ‘Text‘, // 添加一个标题
opacity: 0.5} // 设置透明度
下面是marker相关的插件：
1.&：提供了丰富多彩的图标
Demo：http://jsfiddle.net/VPzu4/92/
2.：强大的集聚插件
3.：美化的label
4.：使marker沿线运动
5.：加载marker时有个弹跳动画
6.:处理重叠在一起的markers
7.:在边框上显示不在当前视野中的marker
&本人建了一个Leaflet交流群：Leaflet&WebGIS&&标签：&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&原文：/shitao/p/3538246.html
&&国之画&&&& &&&&&&
&& &&&&&&&&&&&&&&
鲁ICP备号-4
打开技术之扣，分享程序人生！