地图的折线：Polyline
(1)var polyline = new BMap.Polyline([new BMap.Point(X1,Y1),new BMap.Point(X2,Y2),new BMap.Point(X3,Y3)],{strokeColor:"blue", strokeWeight:6, strokeOpacity:0.5});
(2)map.addOverlay(polyline);
<html>
<head>
<!--引用百度地图-->
<script type="text/javascript" src="http://api.map.baidu.com/api?v=1.3">
</script>
<title>
地图折线
</title>
<!--
设计样式
container容器：占50%大小
-->
<style type="text/css">
#container{
width:50%;
height:50%;
}
</style>
</head>
<body>
<div id="container"></div>
<script type="text/javascript">
var map = new BMap.Map("container");//在container容器中创建一个地图,参数container为div的id属性;
var point = new BMap.Point(116.404, 39.915);//定位
map.centerAndZoom(point,15); //将point移到浏览器中心，并且地图大小调整为15; //标注
var marker = new BMap.Marker(point);
map.addOverlay(marker);
marker.addEventListener("click",function(){ //点击标注时出发事件
alert("您点击了标注");
});
marker.enableDragging(); //标注可拖拽 //创建信息窗口
var opts = {
width : 250, // 信息窗口宽度
height: 100, // 信息窗口高度
title : "Hello" // 信息窗口标题
}
var infoWindow = new BMap.InfoWindow("World", opts); // 创建信息窗口对象
map.openInfoWindow(infoWindow, map.getCenter()); // 打开信息窗口 //折线
var polyline = new BMap.Polyline([
new BMap.Point(116.399, 39.910),
new BMap.Point(116.405, 39.920),
new BMap.Point(117.321,40.321)
],
{strokeColor:"blue", strokeWeight:6, strokeOpacity:0.5} //蓝色、宽度为6
);
map.addOverlay(polyline); </script>
</body>
</html>
地图的折线：Polyline的更多相关文章
- 高德地图API中折线polyline不能跨越180度经度线的解决方案
1.问题 最近在使用高德地图的API,有一个需求是画出对象的历史轨迹,采用了高德地图API中的折线polyline函数.但如果需要跨180度经度线的折线,会出现不能跨越的情况,如下图所示: 图中有三个 ...
- 百度地图笔记_覆盖物（标注marker，折线polyline，多边形polygon）的点击弹窗和右键菜单
利用绘制工具绘制点线面,并在执行绘制完成回调事件给相应覆盖物添加事件操作,提供标注的点击弹窗和标注.折线.多边形的右键删除 效果图如下: 完整代码如下:html+js <!DOCTYPE htm ...
- 百度地图API的使用
------------------自说自话----------------------------- 好奇怪,习惯性使用有道云笔记记录心得与知识后就很少用博客园来记录了. 但是后来想想,有些东西还是 ...
- Google 地图 API V3 之 叠加层
Google官方教程: Google 地图 API V3 使用入门 Google 地图 API V3 针对移动设备进行开发 Google 地图 API V3 之事件 Google 地图 API V3 ...
- 百度地图API开发指南
简介什么是百度地图API? 百度地图API是一套由JavaScript语言编写的应用程序接口,它能够帮助您在网站中构建功能丰富.交互性强的地图应用.百度地图API包含了构建地图基本功能的各种接口,提供 ...
- 百度地图LV1.5实践项目开发工具类bmap.util.jsV1.3
/** * 百度地图使用工具类-v1.5 * * @author boonya * @date 2013-7-7 * @address Chengdu,Sichuan,China * @email b ...
- 百度地图LV1.5实践项目开发工具类bmap.util.jsV1.2
/** * 百度地图使用工具类-v1.5 * * @author boonya * @date 2013-7-7 * @address Chengdu,Sichuan,China * @email b ...
- 百度地图LV1.5实践项目开发工具类bmap.util.jsV1.1
/** * 百度地图使用工具类-v1.5 * * @author boonya * @date 2013-7-7 * @address Chengdu,Sichuan,China * @email b ...
- 百度地图LV1.5实践项目开发工具类bmap.util.jsV1.0
/** * 百度地图使用工具类-v1.5 * * @author boonya * @date 2013-7-7 * @address Chengdu,Sichuan,China * @email b ...
随机推荐
- POJ-1984-Navigation Nightmare+带权并查集（中级
传送门:Navigation Nightmare 参考:1:https://www.cnblogs.com/huangfeihome/archive/2012/09/07/2675123.html 参 ...
- codeforces Round #389（Div.2）C Santa Claus and Robot（思维题）
题目链接:http://codeforces.com/contest/752/problem/C 题意:给出一系列机器人的行动方向(机器人会走任意一条最短路径),问最少标记几个点能让机器人按这个 路径 ...
- codeforces 768 C. Jon Snow and his Favourite Number（思维+暴力）
题目链接:http://codeforces.com/contest/768/problem/C 题意:给出n个数,k个操作,和一个x,每次操作先排序然后对奇数位数进行xor x操作,最后问k次操作后 ...
- js中的所有兼容问题总结
js兼容问题总结 在学习js过程中很多人都遇到过兼容问题,这些兼容问题是因为各版本浏览器不同导致的,为了解决这些兼容问题,js给我们提供了解决这些兼容问题的方案,对此,我个人进行了汇集以及总结. ...
- Android Activity启动耗时统计方案
作者:林基宗 Activity的启动速度是很多开发者关心的问题,当页面跳转耗时过长时,App就会给人一种非常笨重的感觉.在遇到某个页面启动过慢的时候,开发的第一直觉一般是onCreate执行速度太慢了 ...
- Flink文章测试
Flink文章测试 Flink文章测试 Flink文章测试 Flink文章测试 Flink文章测试 Flink文章测试 Flink文章测试 Flink文章测试 Flink文章测试 Flink文章测试 ...
- Servlet跳转方式sendReDirect()和forward()
在web应用服务中,经常会面对不同SERVLET之间的跳转,目前我们可以通过以下两种方式实现: 1.RequestDispatcher.forward() 2.ServletResponse.send ...
- Net基础篇_学习笔记_第十一天_面向对象（构造函数）
VS封装字段快捷键: 提取方法 Ctrl+R,M 封装字段 Ctrl+R,E 提取接口 Ctrl+R,I. 构成函数: public Student() { Con ...
- Redis的复制（Master/Slave）、主从复制、读写分离 （下）
哨兵模式(就是反客为主的自动版) 能够自动监控主机是否故障,如果故障了根据投票数自动将从机变成主机 1创建哨兵文件 touch sentinel.conf [root@localhost myredi ...
- <%@ include %>导入的文件乱码
如: <% String ss = (String) session.getAttribute("username"); if (ss == null || ss == &q ...