百度地图开发(8):地图覆盖物实现纵横交错的交通网络

强制格式化百度标签样式

.BMapLabel {background: none !important;border: none !important;
}

标签样式表

.shu_txt {font-size: 10px;font-weight: bold;color: #333;text-shadow: 1px 1px 2px #f5f5f5, 1px 1px 2px #f5f5f5, 1px 1px 2px #f5f5f5, 1px 1px 9px #f5f5f5, 1px 1px 2px #f5f5f5, 1px 1px 2px #f5f5f5;text-decoration: none;transform: rotate(52deg);-webkit-transform: rotate(52deg);-moz-transform: rotate(52deg);-ms-transform: rotate(52deg);}.heng_txt {font-size: 10px;font-weight: bold;color: #333;text-shadow: 1px 1px 2px #f5f5f5, 1px 1px 2px #f5f5f5, 1px 1px 2px #f5f5f5, 1px 1px 2px #f5f5f5, 1px 1px 2px #f5f5f5, 1px 1px 2px #d2d2d2;text-decoration: none;transform: rotate(10deg);-webkit-transform: rotate(10deg);-moz-transform: rotate(10deg);-ms-transform: rotate(10deg);
}

初始化地图

    var map = new BMap.Map("allmap", {enableMapClick: false});var point = new BMap.Point(113.239654, 22.015262);map.centerAndZoom(point, 12);map.enableScrollWheelZoom();map.setMapType(BMAP_SATELLITE_MAP);

添加覆盖物

  // 创建polyline对象(港珠澳大桥延长线)var gzadq = [new BMap.Point(113.043895, 22.024912),new BMap.Point(113.061718, 22.028798),new BMap.Point(113.077384, 22.029066),new BMap.Point(113.107567, 22.033891),new BMap.Point(113.117484, 22.035097),new BMap.Point(113.128695, 22.038849),new BMap.Point(113.134157, 22.042065),new BMap.Point(113.137606, 22.044611),new BMap.Point(113.144218, 22.047827),new BMap.Point(113.145943, 22.047961),new BMap.Point(113.14853, 22.049435),new BMap.Point(113.152698, 22.049569),new BMap.Point(113.155429, 22.051043),new BMap.Point(113.159166, 22.052115),new BMap.Point(113.164125, 22.053878),new BMap.Point(113.174904, 22.056156),new BMap.Point(113.185109, 22.054548),new BMap.Point(113.198763, 22.051064),new BMap.Point(113.205806, 22.052538),new BMap.Point(113.226359, 22.057228),new BMap.Point(113.234264, 22.056156),new BMap.Point(113.258842, 22.05361),new BMap.Point(113.26416, 22.053074),new BMap.Point(113.27264, 22.054012),new BMap.Point(113.275515, 22.05562),new BMap.Point(113.275371, 22.055486),new BMap.Point(113.282126, 22.056424),new BMap.Point(113.289025, 22.057496),new BMap.Point(113.302536, 22.057898),new BMap.Point(113.310728, 22.054816),new BMap.Point(113.32122, 22.048786),new BMap.Point(113.33545, 22.046374),new BMap.Point(113.341055, 22.04959),new BMap.Point(113.347523, 22.051868),new BMap.Point(113.367357, 22.05763),];var gzadqline = new BMap.Polyline(gzadq, {enableEditing: false,//是否启用线编辑，默认为falseenableClicking: true,//是否响应点击事件，默认为truestrokeWeight: '4',//折线的宽度，以像素为单位strokeOpacity: 1,//折线的透明度，取值范围0 - 1strokeColor: "#414aff" //折线颜色});map.addOverlay(gzadqline);var gsContent ="<div class='heng_txt'>" +"<a>港珠澳大桥延长线</a>" +"</div>";for (var i = 0; i < 3; i++) {var xypo = [new BMap.Point(113.190786, 22.052538), new BMap.Point(113.328191, 22.04959), new BMap.Point(113.069048, 22.027994)];var labeltxt1 = new BMap.Label(gsContent, {offset: new BMap.Size(0, 0), position: xypo[i]});map.addOverlay(labeltxt1);}

lockdatav Done !

百度地图开发(8):地图覆盖物实现纵横交错的交通网络相关推荐

高德地图开发之地图配置及vue上初始化创建地图
开门见山地说,现如今地图相关的开发业务在工作中越来越常见,目前市面上主流的地图开发还是以百度和高德为主,今天就来讲一下高德地图的配置和在vue上的初始化创建,帮助大家更好更快的了解高德地图开发相关的 ...
android高德地图自定义地图,(android地图开发) 高德地图自定义对话框
截图效果: 布局文件: android:layout_width="fill_parent" android:layout_height="fill_parent&quo ...
高德地图开发自定义地图样式
1.首先打开高都地图api自定义地图界面(自定义地图) 2.点进去,进行自定义地图配置自定义样式 3.定义结束,点击发布 4.接下来点击使用自定义地图,会生成一串码 5.点击复制,在地图初始化调用这 ...
百度地图开发：多边形覆盖物鼠标高亮效果和标签展示
样式表CSS html, body {margin: 0px;padding: 0px;}#container {height: 100%;}.BMapLabel {
百度地图开发--解决地图无法显示的问题
今天要解决的是百度地图有时显示不出来,即一直显示网格的问题. 前几天换了公司发的新电脑,所以开发工具也换了,因为这个项目最开始是用eclipse 开发的,所以也懒得换过来,都弄好之后跑起来发现地图显示 ...
iOS 国外地图开发谷歌地图坐标放到苹果地图上坐标不准确
首先请允许我发一个牢骚.苹果地图这个坑... 一 .我们要开发一个国外定点展示房屋信息的地图应用.效果图如下: . 二.第一反应用苹果原生地图Mapkit做.我们的坐标点都是从谷歌地图上取出来的. 功 ...
SuperMap iMobile for Android 地图开发在线地图服务接入（二）
一.对接百度地图服务 DatasourceConnectionInfo info = new DatasourceConnectionInfo(); //设置数据源别名 info.setAlias(& ...
Android 手机地图开发-高德地图问题
高德地图地址:http://code.autonavi.com 示例程序及SDK下载地址如何获取AutoNavi MAP API密钥 AutoNavi提供的地图通过MapView对象进行显示.Map ...
android高德显示指定位置,高德地图开发(二)地图上显示指定位置
我们在用地图软件搜索的时候,搜索结果会在地图上以红点显示,现在我们来实现一个在地图上显示指定位置的程序,先看效果图. 要实现这么个功能,首先要能将地图视图中心移动到以指定位置:还有在指定位置绘制一个点 ...

百度地图开发(8):地图覆盖物实现纵横交错的交通网络

强制格式化百度标签样式

标签样式表

初始化地图

添加覆盖物

百度地图开发(8):地图覆盖物实现纵横交错的交通网络相关推荐

最新文章

热门文章