51 地图标注接口(一)

简介: 1. 51map 标注接口   实现在地图上标注位置、采集位置信息等操作。说的普通点就是获得地图上某个地方的经纬度和放缩比例   使用这个接口需要引入两段js:         2. 51map 标注接口效果图      该图主要显示了标注获得经纬度的结果。

1. 51map 标注接口

  实现在地图上标注位置、采集位置信息等操作。说的普通点就是获得地图上某个地方的经纬度和放缩比例

  使用这个接口需要引入两段js:

  <script language="javascript" src="http://api.51ditu.com/js/maps.js"></script>

  <script language="javascript" src="http://api.51ditu.com/js/ezmarker.js"></script>

 

2. 51map 标注接口效果图

  

  该图主要显示了标注获得经纬度的结果。点击上面的标注位置这个按钮,可以出现一个地图,在地图上可以标注任何一个位置的地理位置。

  使用该地图标注可以获得地图上的地理位置和地图的放缩比例。该功能主要用于采集数据。当然这个获得的经纬度数值不是单纯的经纬度,而是经纬度数字*100000 获得的。在上面一副图的文本框中可以看出。

 

3. 51map 标注用法代码说明

img_405b18b4b6584ae338e0f6ecaf736533.gif 代码
 1  < html >
 2       < head >
 3           < meta http - equiv = " Content-Type "  content = " text/html; charset=UTF-8 " >
 4           < title > Untitled Document < / title>
 5           < script language = " javascript "  src = " jquery-1[1].2.3.min.js " >< / script>
 6           < script language = " javascript "  src = " http://api.51ditu.com/js/maps.js " >< / script>
 7           < script language = " javascript "  src = " http://api.51ditu.com/js/ezmarker.js " >< / script>
 8           < script language = " JavaScript " >
 9              
10               /* *
11               * LTEZMarker : 用于显示地图标注
12               * 该操作一般用于采集地理位置经纬度
13               * 
14               * LTEvent.addListener 添加一个事件 由哪个标注值来填充数据
15               * 
16               * setDefaultView  设置默认的标注位置,一般用地理位置的拼音来
17               * 指定,如shanghai
18               * 
19               * ezmarker.setValue 也可以使用经纬度坐标来标注默认位置
20               * 
21                */
22               function  setMap(point,zoom){
23                  document.getElementById( " txtX " ).value = point.getLongitude();
24                  document.getElementById( " txtY " ).value = point.getLatitude();
25                  document.getElementById( " txtZ " ).value = zoom;
26              }
27               var  ezmarker = new  LTEZMarker( " ezmarker " );
28              ezmarker.setDefaultView( " shanghai " , 5 );
29              ezmarker.setValue( new  LTPoint( 11200000 , 4000000 ), 10 );
30              LTEvent.addListener(ezmarker, " mark " ,setMap); //
31           < / script>
32          
33       < / head>
34       < body >
35           < br / ><br / >< br / >
36          X:    < input type = " text "  id = " txtX "  value = ""   / ><br / >
37          Y:    < input type = " text "  id = " txtY "  value = ""   / ><br / >
38          Z:    < input type = " text "  id = " txtZ "  value = ""   / ><br / >
39       < / body>
40  < / html>
41 

 

 

var ezmarker=new LTEZMarker("ezmarker");

用于地图标注的类

其中setDefaultView("shanghai",5) 方法是用于设置默认标注的位置和放缩比例。方法前面的参数是城市或地址位置的拼音或者汉字,后面的是放缩比例。

如果说要默认标注某个经纬度使用 setValue(new LTPoint(11200000,4000000),10)

LTEvent.addListener(ezmarker,"mark",setMap) 是为这个标注添加一个监听事件

相关文章
|
JavaScript
JS 如何动态获取本地文件夹中的所有图片
JS 如何动态获取本地文件夹中的所有图片
1198 0
|
存储 分布式计算 资源调度
ARM+麒麟大数据环境搭建:Hadoop
ARM+麒麟大数据环境搭建:Hadoop
3546 0
ARM+麒麟大数据环境搭建:Hadoop
|
2月前
|
人工智能 自然语言处理 Ubuntu
阿里云+本地从部署OpenClaw到变现!+ 赚钱工具skill封装技巧(5大高盈利Wrapper开发实操)
OpenClaw(原Clawdbot)作为2026年开源AI领域的核心工具,凭借“自然语言指令+自动化任务执行”的核心能力,成为打破技术壁垒的关键。它本身免费开源,却因配置门槛卡住了95%的潜在用户——普通用户需要花费数十小时学习Skill开发、API对接、模型适配等复杂操作,才能实现个性化需求。这一“能力与可及性的鸿沟”,催生了全新的商业化机会:封装预配置的OpenClaw套装(即Wrapper),向特定行业用户出售“现成可用的数字员工”。
977 7
|
1月前
|
人工智能 自然语言处理 安全
Claude Code 全攻略:命令大全 + 实战工作流(建议收藏)
本文介绍了Claude Code终端AI助手的使用指南,主要内容包括:1)常用命令如版本查看、项目启动和更新;2)三种工作模式切换及界面说明;3)核心功能指令速查表,包含初始化、压缩对话、清除历史等操作;4)详细解析了/init、/help、/clear、/compact、/memory等关键命令的使用场景和语法。文章通过丰富的界面截图和场景示例,帮助开发者快速掌握如何通过命令行和交互界面高效使用Claude Code进行项目开发,特别强调了CLAUDE.md文件作为项目知识库的核心作用。
25348 65
Claude Code 全攻略:命令大全 + 实战工作流(建议收藏)
|
28天前
|
人工智能 JavaScript API
阿里云百炼Coding Plan最新抢购攻略+OpenClaw保姆级部署教程
阿里云百炼Coding Plan作为面向开发者的AI编码订阅服务,凭借高性价比、多模型聚合与OpenAI兼容接口,成为2026年AI开发领域的热门选择。截至2026年4月,Lite基础版已停止新购,仅Pro进阶版可订阅,且因需求激增,官方采取每日9:30限量补货策略,页面频繁显示“售罄”。
1086 4
|
26天前
|
数据采集 开发框架 监控
【Azure Developer】IIS w3wp.exe 的 -m 参数:一个未被记录的管道模式标识
本文揭秘了IIS中未公开的`w3wp.exe -m`启动参数:`-m 0`表示Integrated管道模式(推荐),`-m 1`为Classic模式。该发现源于Application Insights自动检测失效的排查,解释了其为何不支持Classic模式——因HttpModule无法全面拦截请求。
130 12
|
缓存 编译器 调度
【C/C++ 性能优化】了解cpu 从而进行C++ 高效编程
【C/C++ 性能优化】了解cpu 从而进行C++ 高效编程
840 0
|
定位技术 计算机视觉 C++
C++计算机视觉库OpenCV在Visual Studio 2022的配置方法
C++计算机视觉库OpenCV在Visual Studio 2022的配置方法
1004 1