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

简介: 百度地图开发(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,//是否启用线编辑,默认为false
        enableClicking: true,//是否响应点击事件,默认为true
        strokeWeight: '4',//折线的宽度,以像素为单位
        strokeOpacity: 1,//折线的透明度,取值范围0 - 1
        strokeColor: "#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 !


目录
打赏
0
0
0
0
184
分享
相关文章
Go 网络编程:HTTP服务与客户端开发
Go 语言的 `net/http` 包功能强大,可快速构建高并发 HTTP 服务。本文从创建简单 HTTP 服务入手,逐步讲解请求与响应对象、URL 参数处理、自定义路由、JSON 接口、静态文件服务、中间件编写及 HTTPS 配置等内容。通过示例代码展示如何使用 `http.HandleFunc`、`http.ServeMux`、`http.Client` 等工具实现常见功能,帮助开发者掌握构建高效 Web 应用的核心技能。
160 61
FFmpeg开发笔记(六十)使用国产的ijkplayer播放器观看网络视频
ijkplayer是由Bilibili基于FFmpeg3.4研发并开源的播放器,适用于Android和iOS,支持本地视频及网络流媒体播放。本文详细介绍如何在新版Android Studio中导入并使用ijkplayer库,包括Gradle版本及配置更新、导入编译好的so文件以及添加直播链接播放代码等步骤,帮助开发者顺利进行App调试与开发。更多FFmpeg开发知识可参考《FFmpeg开发实战:从零基础到短视频上线》。
897 2
FFmpeg开发笔记(六十)使用国产的ijkplayer播放器观看网络视频
VB6网络通信软件上位机开发,TCP网络通信,读写数据并处理,完整源码下载
本文介绍使用VB6开发网络通信上位机客户端程序,涵盖Winsock控件的引入与使用,包括连接服务端、发送数据(如通过`Winsock1.SendData`方法)及接收数据(利用`Winsock1_DataArrival`事件)。代码实现TCP网络通信,可读写并处理16进制数据,适用于自动化和工业控制领域。提供完整源码下载,适合学习VB6网络程序开发。 下载链接:[完整源码](http://xzios.cn:86/WJGL/DownLoadDetial?Id=20)
144 12
|
8月前
|
API
鸿蒙开发:切换至基于rcp的网络请求
本文的内容主要是把之前基于http封装的库,修改为当前的Remote Communication Kit(远场通信服务),无非就是通信的方式变了,其他都大差不差。
216 4
鸿蒙开发:切换至基于rcp的网络请求
C 语言物联网开发之网络通信与数据传输难题
本文探讨了C语言在物联网开发中遇到的网络通信与数据传输挑战,分析了常见问题并提出了优化策略,旨在提高数据传输效率和系统稳定性。
FFmpeg开发笔记(五十六)使用Media3的Exoplayer播放网络视频
ExoPlayer最初是为了解决Android早期MediaPlayer控件对网络视频兼容性差的问题而推出的。现在,Android官方已将其升级并纳入Jetpack的Media3库,使其成为音视频操作的统一引擎。新版ExoPlayer支持多种协议,解决了设备和系统碎片化问题,可在整个Android生态中一致运行。通过修改`build.gradle`文件、布局文件及Activity代码,并添加必要的权限,即可集成并使用ExoPlayer进行网络视频播放。具体步骤包括引入依赖库、配置播放界面、编写播放逻辑以及添加互联网访问权限。
567 1
FFmpeg开发笔记(五十六)使用Media3的Exoplayer播放网络视频
安卓与iOS开发:选择的艺术网络安全与信息安全:漏洞、加密与意识的交织
【8月更文挑战第20天】在数字时代,安卓和iOS两大平台如同两座巍峨的山峰,分别占据着移动互联网的半壁江山。它们各自拥有独特的魅力和优势,吸引着无数开发者投身其中。本文将探讨这两个平台的特点、优势以及它们在移动应用开发中的地位,帮助读者更好地理解这两个平台的差异,并为那些正在面临选择的开发者提供一些启示。
170 56
交通标志识别系统Python+卷积神经网络算法+深度学习人工智能+TensorFlow模型训练+计算机课设项目+Django网页界面
交通标志识别系统。本系统使用Python作为主要编程语言,在交通标志图像识别功能实现中,基于TensorFlow搭建卷积神经网络算法模型,通过对收集到的58种常见的交通标志图像作为数据集,进行迭代训练最后得到一个识别精度较高的模型文件,然后保存为本地的h5格式文件。再使用Django开发Web网页端操作界面,实现用户上传一张交通标志图片,识别其名称。
422 6
交通标志识别系统Python+卷积神经网络算法+深度学习人工智能+TensorFlow模型训练+计算机课设项目+Django网页界面
|
10月前
|
基于GA遗传优化的离散交通网络双层规划模型设计matlab仿真
该程序基于GA遗传优化设计了离散交通网络的双层规划模型,以路段收费情况的优化为核心,并通过一氧化碳排放量评估环境影响。在MATLAB2022a版本中进行了验证,显示了系统总出行时间和区域排放最小化的过程。上层模型采用多目标优化策略,下层则确保总阻抗最小,实现整体最优解。
|
11月前
|
C++
C++ Qt开发:QUdpSocket网络通信组件
QUdpSocket是Qt网络编程中一个非常有用的组件,它提供了在UDP协议下进行数据发送和接收的能力。通过简单的方法和信号,可以轻松实现基于UDP的网络通信。不过,需要注意的是,UDP协议本身不保证数据的可靠传输,因此在使用QUdpSocket时,可能需要在应用层实现一些机制来保证数据的完整性和顺序,或者选择在适用的场景下使用UDP协议。
511 2

热门文章

最新文章

AI助理

你好,我是AI助理

可以解答问题、推荐解决方案等