脚本请参见: 整合google,51ditu和mapbar的地图API

现在来说一下用html页面调用脚本

先载入3个地图的api脚本,如果要在网站使用,必须去地图的官方网站注册一个key才行。不过本地调试没问题(127.0.0.1或localhost)
<script type="text/javascript" src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=abcdefg"></script>
<script type="text/javascript" src="http://api.51ditu.com/js/maps.js"></script>
<script type="text/javascript" src="http://union.mapbar.com/apis/maps/free?f=mapi&v=31&k=abcdef"></script>

IE的画线要使用VML 技术
<style type="text/css">
<!--

v/:*{Behavior:url(#default#VML);}
-->
</style>

调用地图API

<script type="text/javascript">
var map=null;
function mapload(maptype)
{
 map=new myMap(
 {
  "divobj":"map",
  "maptype":maptype,
  "lat":36.144459040000,
  "lng":120.416552501369994,
  "scale":8
 });
 maplet=map.init(maptype);//针对Mapbar,必须定义此名称的全局变量
 map.addPoint(36.0612508601570,120.380276441570004,"五四广场",true,{"title":"信息提示","mapbarlabel":"五四广场"});
 map.addLine(36.144459040000,120.417052501369994,36.0612508601570,120.380276441570004);
}
</script>

页面的调用如下:

<body οnlοad="mapload('google')">
<input type="button" οnclick="map.removeAll()" value="清除全部" />
<input type="button" οnclick="map.removePointAll()" value="清除全部点" />
<input type="button" οnclick="map.removeLineAll()" value="清除全部线" />
<input type="button" οnclick="mapload('google')" value="使用google地图" />
<input type="button" οnclick="mapload('51Ditu')" value="使用51地图" />
<input type="button" οnclick="mapload('Mapbar')" value="使用Mapbar地图" />
<!--
地图显示容器,需要在创建地图对象前创建
地图的大小通过容器的属性获取, 修改容器的大小后需要调用 map.resize() 使地图适应容器的大小
-->
<div id="map" style="width: 500px; height: 300px"></div>

[js]调用google,51ditu和mapbar的地图API相关推荐

  1. 高德地图api调用demo_微信小程序----高德地图API实现的DEMO

    [实例简介] 微信小程序----高德地图API实现的周边,天气,路线规划,地址详情等的DEMO.简单的效果,问一下官方能不能不要乱涨积分,你们涨积分,作者被骂!我真的很失望,再这样,我就不上传资源了! ...

  2. js 实现精准定位(使用百度地图API)

    获取定位城市 使用百度地图API时记得申请AK 使用步骤如下 1.0 引用 <script type="text/javascript" src="http://a ...

  3. 使用js 调用 google ads

    在网页中插入 Google AdSense 广告,一般将源代码直接嵌入主题模板页面.事实上 Google AdSense 支持并允许使用 JS 文件调用.当然前提是不要因任何原因修改代码,或手动影响广 ...

  4. js 调用android定位,基于html5+ 高德地图JS API使用安卓定位sdk用来进行定位

    使用Native.js打开Android的H5辅助定位 mui.plusReady(function() { if(plus.os.name == 'Android') { var AMapLocat ...

  5. google地图静态下载和js调用

    google地图静态下载和js调用 google staticmap使用 google地图js调用 google地图静态下载 1)注册google帐号 2)开启google static map功能 ...

  6. Google中国地图API应用

    <script type="text/javascript"></script> <script src="http://pagead2.g ...

  7. Python调用高德地图API实现经纬度换算、地图可视化

    作者 | 糖甜甜甜 出品 | 经管人学数据分析 Python调用高德地图API实现经纬度换算.地图可视化 前地图可视化的工具和函数比较多,但是在不知道相关地点经纬度的情况下,通过python调用高德地 ...

  8. python 根据经纬度 调取和显示地图_Python调用高德地图API实现经纬度换算、地图可视化-站长资讯中心...

    目前地图可视化的工具和函数比较多,但是在不知道相关地点经纬度的情况下,通过python调用高德地图API实现经纬度换算,并且直接在高德地图新推出的轻量级可视化平台上实现一键式地图可视化,这其中需要申请 ...

  9. 你还在为高德地图找不到门牌号等详细地址而烦恼吗?你还在等什么——Python调用高德地图API实现经纬度换算、地图可视化

    Python调用高德地图API实现经纬度换算.地图可视化 前地图可视化的工具和函数比较多,但是在不知道相关地点经纬度的情况下,通过python调用高德地图API实现经纬度换算,并且直接在高德地图新推出 ...

  10. python调用高德地图api 可视化_Python调用高德地图API实现经纬度换算、地图可视化...

    前地图可视化的工具和函数比较多,但是在不知道相关地点经纬度的情况下,通过python调用高德地图API实现经纬度换算,并且直接在高德地图新推出的轻量级可视化平台上实现一键式地图可视化,这其中需要申请密 ...

最新文章

  1. Onekey Ghost找不到硬盘分区怎么办
  2. window.opener
  3. 禁止冒名顶替Exchange用户发送邮件
  4. 3.23 vi/vim:纯文本编辑器
  5. mysql修改engine_mysql下修改engine引擎的方法
  6. mysql前一天_mysql查询当天,前一天,一周,一个月
  7. 并发容器——ConcurrentHashMap
  8. JAVA远程通信的几种选择(RPC,Webservice,RMI,JMS的区别)
  9. AD 组策略应用与排错(2排错)
  10. Vim 实用技术,第 2 部分: 常用插件(转)
  11. H5:100款html5微信小游戏最新最新源码
  12. java面试题框架篇
  13. java oracle11g jar_oracle11g驱动jar包下载
  14. 单片机控制步进电机正反转c语言程序,单片机控制步进电机1步10步100步正反转...
  15. SPSS Modeler 和spss statistics有什么不同
  16. 怎么进计算机更新失败,系统更新失败无法进入系统怎么办?
  17. 汽车4G车载TBOX智能终端
  18. 仓库货架通道宽度的设计要求和注意事项
  19. 1142:单词的长度
  20. python 数列筛选_numpy ndarray 按条件筛选数组,关联筛选的例子

热门文章

  1. python输入税前工资打印税后工资-python-计算个人所得税
  2. 力扣(LeetCode)244. 最短单词距离 II(2022.09.01)
  3. java倒计时_详解java倒计时三种简单实现方式
  4. round函数与roundup函数
  5. html文本框自动宽度,input文本框宽度自适应
  6. shiro集成jwt
  7. sof_pof_jic_elf程序下载方法
  8. java jpanel 数据刷新6_刷新swing
  9. 什么是SaaS模式 - SaaS模式的视频会议系统
  10. 开源WPF第三方库【Newbeecoder.UI】分页控件