原因: 添加标记的时候需要加上中扩号-> map.addLayers([markers]); var lon = 107.5781; var lat = 36.8796; var zoom = 2; var map, layer,gmap,markers; var objMouse; var options = { projection: new OpenLayers.Projection("EPSG:900913"), displayProjection: new OpenLayers.Projection("EPSG:4326"), units: "m", maxResolution: 156543.0339, numZoomLevels: 10, maxExtent: new OpenLayers.Bounds(-20037508.34, -20037508.34, 20037508.34, 20037508.34) }; map = new OpenLayers.Map('map',options); createPopup(); function createPopup() { markers = new OpenLayers.Layer.Markers( "Markers" ); markers.addMarker(GetMark(lon,lat)); markers.events.register('click', markers, function(){ popup = new OpenLayers.Popup("chicken", new OpenLayers.LonLat(lon,lat), new OpenLayers.Size(20,20), "haha!!!", true); popup.autoSize=true; map.addPopup(popup); }); map.addLayers([markers]); map.setCenter(new OpenLayers.LonLat(lon, lat), zoom); } function GetMark(lo,lat) { var size = new OpenLayers.Size(70,30); var offset = new OpenLayers.Pixel(-(size.w/2), -size.h); var icon = new OpenLayers.Icon('http://www.k1982.com/png/up/200905/20090513082309637.png',size,offset); return new OpenLayers.Marker(new OpenLayers.LonLat(lon,lat),icon) } 2.用Google的地图,添加标记时候用的经纬不能准确定位标记 像素值与实际经纬度值的互转 map.events.register('click',gmap,function(ev){ var lonLat=map.getLonLatFromPixel(ev.xy); if (map.displayProjection) { //将像素值转换成经纬度 lonLat.transform(map.getProjectionObject(),map.displayProjection ); //将经纬度转换成像素值 lonLat.transform(map.displayProjection,map.getProjectionObject()); } 3.用经纬度来为地图添加标记 var laolat_v=new OpenLayers.LonLat(lo,la); if (map.displayProjection) { laolat_v.transform(map.displayProjection,map.getProjectionObject()); } markers = new OpenLayers.Layer.Markers( "Markers" ); markers.addMarker(GetMark(laolat_v)); markers.events.register('click', markers, function(){ popup = new OpenLayers.Popup("chicken", laolat_v, new OpenLayers.Size(20,20), "haha!!!", true); popup.autoSize=true; map.addPopup(popup); }); map.addLayers([markers]); } function GetMark(laolat_v) { var size = new OpenLayers.Size(70,30); var offset = new OpenLayers.Pixel(-(size.w/2), -size.h); var icon = new OpenLayers.Icon('http://www.k1982.com/png/up/200905/20090513082309637.png',size,offset); var mk=new OpenLayers.Marker(laolat_v,icon) //mk.visible=false; return mk; } #Openlayers
相关推荐
下面将详细介绍如何解决OpenLayers中的跨域问题。 ### 一、理解同源策略 同源策略是Web浏览器的一项安全措施,它限制了来自不同源(协议、域名、端口)的脚本之间共享资源。例如,一个运行在http://example.com上...
然后就去看了相关openlayers的文档,选择了6.15.1版本,然后仿照地震热力图例子写了代码,但是由于自带是OSM地图,不符合项目要求,所以研究了如何加载百度地图,又顺利踩坑坐标偏移问题。 问题1:openlayers默认...
在OpenLayers中,"tooltip"(文字提示)是一种常见的功能,用于提供关于地图上特定要素的额外信息,当用户将鼠标悬停在要素上方时,会显示一个包含相关信息的小窗口。 在OpenLayers中实现地图要素的tooltip,通常...
- **社区和论坛**:参与OpenLayers社区讨论,解决实际问题,与其他开发者交流经验。 通过阅读这份中文手册,开发者不仅可以了解OpenLayers的基本概念,还能学习如何在实际项目中应用OpenLayers,从而构建出功能...
关于OpenLayers的popup(弹窗),可以创建一个新的OpenLayers.Popup实例,并将其添加到地图和特定的地理位置: ```javascript var popup = new OpenLayers.Popup.FramedCloud("popupId", new OpenLayers.LonLat(x, y...
OpenLayers 3 是一个强大的开源JavaScript库,专门用于在Web浏览器中展示地图和地理空间数据。这个"openlayers3-test"项目显然是一个针对OpenLayers 3的测试集或示例集合,帮助开发者理解和学习如何有效地使用这个库...
在OpenLayers中调用百度地图是一项常见的需求,特别是在构建Web GIS应用时,用户可能希望结合OpenLayers的强大功能和百度地图的丰富数据。OpenLayers是一个开源JavaScript库,用于创建交互式的地图应用,而百度地图...
这个“openlayers5.3.0文档高速版”是针对官方文档的优化版本,解决了在线文档中可能存在的资源加载问题,实现了完全离线访问,并且提高了文档的打开速度。 1. **离线访问**:文档中的所有资源,包括CSS样式、API...
OpenLayers 3 提供了丰富的API和文档,可以帮助开发者解决这些问题。同时,利用Canvas进行自定义绘图可以实现更复杂和动态的地图效果,但也要注意性能开销,尤其是在大量数据或高分辨率屏幕下。
10. **社区支持**:拥有活跃的开发者社区,提供问题解答、插件扩展和技术分享,有助于开发者解决实际问题。 在OpenLayers-2.12-rc4这个版本中,可能包含的是OpenLayers 2.x系列的一个候选发布版。这个版本相对于...
在OpenLayers这个强大的开源JavaScript库中,用于地图交互和展示,提供了一系列功能,包括地图的显示、图层管理、地理坐标转换以及空间分析等。在这个"OpenLayers简单实例6:距离面积量算2"中,我们将深入探讨如何...
**OpenLayers 开发指南** OpenLayers 是一个开源的JavaScript库,专门用于在Web浏览器中展示地理信息系统(GIS)数据。这个强大的工具允许开发者创建交互式的地图应用,支持多种地图服务,包括WMS、WFS、KML等。...
OpenLayers 是一个开源JavaScript库,专门用于在Web上创建交互式的地图应用。它支持多种地图服务,包括WMS...在实际开发中,记得参考OpenLayers的官方文档,它提供了详细的API参考和教程,是学习和解决问题的重要资源。
此外,Stack Overflow 和GitHub上的开源社区也提供了大量问题解答和示例代码,帮助开发者解决问题并学习新功能。 总之,OpenLayers 是一个功能强大的开源地图库,提供了丰富的功能和高度的定制性,适合各种Web地图...
总结来说,这个项目提供了使用OpenLayers扩展实现风场可视化的解决方案。它结合了OpenLayers的核心库、风场图层扩展、数据文件、用户交互界面和高效的Web服务器部署策略,为用户呈现了一个动态、可交互的风场地图...
在v4.2.0版本中,开发者可以通过官方文档学习如何使用新功能,以及解决可能出现的问题。 **6. 开发与部署:** 在实际项目中,开发人员可以将OpenLayers库通过CDN链接引入,或者下载压缩包(如v4.2.0)到本地,然后...
- **API 文档**:详细的API参考指南,解释了OpenLayers库中的每个类、方法和属性,是开发过程中查找功能和解决问题的关键资源。 - **示例代码**:包含各种示例代码,演示如何使用OpenLayers创建和操作地图,这对于...
OpenLayers 是一个强大的开源JavaScript库,用于在网页上创建交互式的地图应用。它支持多种地图服务,包括WMS、WMTS等,并可以处理各种地理数据格式。在"openlayers 态势箭头、进击箭头等"这个主题中,我们将深入...