大家好,今天给各位分享地图号码采集网站源码分享的一些知识,其中也会对地图数据采集app手机版进行解释,文章篇幅可能偏长,如果能碰巧解决你现在面临的问题,别忘了关注本站,现在就马上开始吧!
说明
先看效果,再看源码~
地图:矢量底图、卫星底图、路况底图
<!DOCTYPEhtml>\n<htmllang=&34;>\n\n<head>\n<metacharset=&34;>\n<metaname=&34;content=&34;>\n<metahttp-equiv=&34;content=&34;>\n<title>创建地图</title>\n<styletype=&34;>\nhtml,body{\nheight:100%;\nmargin:0px;\npadding:0px;\n}\n34;utf-8&34;https://wemapvis.map.qq.com/api/gljs?v=1.exp&key=OB4BZ-D4W3U-B7VVO-4PJWW-6TKDJ-WPB77&34;initMap()&34;container&34;text/javascript&34;container&34;vector&34;satellite&34;traffic&39;2D&34;en&34;UTF-8&34;viewport&34;width=device-width,initial-scale=1.0&34;X-UA-Compatible&34;ie=edge&34;text/css&container{\nwidth:800px;\nheight:600px;\n}\n</style>\n</head>\n<scriptcharset=&34;src=&34;></script>\n<bodyonload=&34;>\n<divid=&34;></div>\n<scripttype=&34;>\nfunctioninitMap(){\n//初始化地图\nvarmap=newTMap.Map(&34;,{\n//设置地图缩放级别\nzoom:11,\nrotation:353,\npitch:73,\nbaseMap:{\n//type:&34;\ntype:&34;\n//type:&34;\n},\n//3D/2D显示模式控制\nviewMode:&39;,\n//设置地图中心点坐标\ncenter:newTMap.LatLng(37.87,112.53),\nadcode:110101//市区县级行政区划代码\n});\n//初始化marker\nvarmarker=newTMap.MultiMarker({\nmap:map,\nstyles:{\n//点标记样式\nmarker:newTMap.MarkerStyle({\nwidth:20,//样式宽\nheight:30,//样式高\nanchor:{x:10,y:30},//描点位置\nsrc:&39;,//标记路径\n}),\n},\ngeometries:[\n//点标记数据数组\n{\n//标记位置(经度,纬度,高度)\nposition:newTMap.LatLng(37.87,112.53,134),\n},\n],\n});\n\n//绑定点击事件\nmap.on(&34;,function(evt){\nvarlat=evt.latLng.getLat().toFixed(6);\nvarlng=evt.latLng.getLng().toFixed(6);\nconsole.log(lat+&34;+lng);\n})\n}\n</script>\n</body>\n\n</html>
Marker轨迹回放
<!DOCTYPEhtml>\n<htmllang=&34;>\n\n<head>\n<metacharset=&34;>\n<metaname=&34;content=&34;>\n<metahttp-equiv=&34;content=&34;>\n<title>Marker轨迹回放-全局模式</title>\n<styletype=&34;>\nhtml,body{\nheight:100%;\nmargin:0px;\npadding:0px;\n}\n34;utf-8&34;https://map.qq.com/api/gljs?v=1.exp&key=OB4BZ-D4W3U-B7VVO-4PJWW-6TKDJ-WPB77&34;container&34;text/javascript&34;container&34;vector&34;satellite&34;traffic&39;2D&39;39;,//线填充色\nwidth:4,//折线宽度\nborderWidth:2,//边线宽度\nborderColor:&FFF&39;round&39;rgba(190,188,188,1)&39;erasePath&39;style_blue&39;car-down&39;map&39;https://mapapi.qq.com/web/lbs/javascriptGL/demo/img/car.png&39;https://mapapi.qq.com/web/lbs/javascriptGL/demo/img/start.png&39;https://mapapi.qq.com/web/lbs/javascriptGL/demo/img/end.png&39;car&39;car-down&39;start&39;start&39;end&39;end&39;moving&39;erasePath',\npassedLatLngs.length-1,\npassedLatLngs[passedLatLngs.length-1]\n);\n}\n});\n</script>\n</body>\n</html>\n
END,本文到此结束,如果可以帮助到大家,还望关注本站哦!
