JS 百度地图 换地图主题颜色(API自带)

  1. <script type="text/javascript"
  2. src="http://api.map.baidu.com/api?v=3.0&ak=PlhFWpA02aoURjAOpnWcRGqw7AI8EEyO"></script>
  1. <div id="allmap" style="height: 90%;"></div>
  2. <select id="stylelist">
  3. <option value="normal">默认地图样式</option> //系统默认
  4. <option value="light">清新蓝风格</option> //不需要第三方库
  5. <option value="dark">黑夜风格</option> //不需要第三方库
  6. <option value="redalert">红色警戒风格</option>
  7. <option value="googlelite">精简风格</option>
  8. <option value="grassgreen">自然绿风格</option>
  9. <option value="midnight">午夜蓝风格</option>
  10. <option value="pink">浪漫粉风格</option>
  11. <option value="darkgreen">青春绿风格</option>
  12. <option value="bluish">清新蓝绿风格</option>
  13. <option value="grayscale">高端灰风格</option>
  14. <option value="hardedge">强边界风格</option>
  15. </select>
  1. // 百度地图API功能
  2. var map = new BMap.Map("allmap");
  3. map.centerAndZoom(new BMap.Point(113.350512, 23.191744),12);
  4. map.enableScrollWheelZoom();
  5.  
  6. changeMapStyle('dark');
  7. $("#stylelist").change(function () {
  8. changeMapStyle(this.value)
  9. })
  10.  
  11. function changeMapStyle(style){
  12. var mapStyle ={
  13. features: ["road","building","water","land"],//隐藏地图上的"poi",
  14. style : style,
  15. };
  16. map.setMapStyle(mapStyle);
  17. }

  

JS 百度地图 换地图主题颜色(自定义)

JS 百度地图 换地图主题颜色(API自带)的更多相关文章

  1. JS 百度地图 换地图主题颜色(自定义)

    JS 百度地图 换地图主题颜色(自定义) 可通过这个在线编辑得到自己想要的主题:https://developer.baidu.com/map/custom/ <div id="all ...

  2. JS 百度地图 地图线路描绘

    JS 百度地图 地图线路描绘 <script type="text/javascript" src="http://api.map.baidu.com/api?v= ...

  3. JS 百度地图路书---动态路线

    JS 百度地图路书---动态路线 <!DOCTYPE html> <head> <meta http-equiv="Content-Type" con ...

  4. 百度未授权使用地图API

    百度地图管理员的回复:这是KEY服务升级的问题, 给您造成的不便,非常抱歉.但我们昨日已修复,你可以再审核一番.若不可以,请提供一下您的系统ak,邮箱或qq发送至(wangwenhai@baidu.c ...

  5. 为什么总是弹出报错“百度未授权使用地图API”?

    今天打开网站的时候出现了这个问题“百度未授权使用地图API, 可能是因为您提供的密钥不是有效的百度开放平台密钥或此密钥未对本应用的百度地图JavasoriptAPI授权.…”经过研究终于知道什么原因了 ...

  6. JS 百度地图-右键菜单

    JS 百度地图-右键菜单 /*-----------------标注右键删除-------------------------*/ var markerMenu = new BMap.ContextM ...

  7. leaflet中如何优雅的解决百度、高德地图的偏移问题

    话不多说,先上效果图 以前在做项目时,经常会听到客户说,你们这个地图是哪来的,太丑了,能不能换成百度地图--高德也行-- 大家生活中,基本上都已经习惯了使用百度地图和高德地图,而在做项目时,用这两个地 ...

  8. Blazor组件自做六 : 使用JS隔离封装Baidu地图

    1. 运行截图 演示地址 2. 在文件夹wwwroot/lib,添加baidu子文件夹,添加baidumap.js文件 2.1 跟上一篇类似,用代码方式异步加载API,脚本生成新的 body > ...

  9. OpenLayers加载百度离线瓦片地图(完美无偏移)

    本文使用OpenLayers最新版本V5.3.0演示:如何使用OpenLayer完美无偏移加载百度离线瓦片地图.OpenLayers 5.3.0下载地址为:https://github.com/ope ...

随机推荐

  1. react起步——从零开始编写react项目

    # index.html <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> ...

  2. 阶段5 3.微服务项目【学成在线】_day18 用户授权_07-动态查询用户权限-权限数据模型

    3 动态查询用户权限 3.1 需求分析 截至目前在测试授权时使用的权限数据是静态数据,正常情况的流程是: 1.管理员给用户分配权限,权限数据写到数据库中. 2.认证服务在进行用户认证时从数据库读取用户 ...

  3. IDEA中提示Error:java: Compilation failed: internal java compiler error

    解决办法:File-->Setting...-->Build,Execution,Deployment-->Compiler-->Java Compiler 设置相应Modul ...

  4. 一个小时学会Git(转载)

    ---恢复内容开始--- 一个小时学会Git     最近要与部门同事一起做技术分享,我选择了Git,因为Git 是一种在全球范围都广受欢迎的版本控制系统.在开发过程中,为了跟踪代码,文档,项目等信息 ...

  5. Casbin 使用记录

    Casbin 是什么? 官方解释:Casbin是一个强大的.高效的开源访问控制框架,其权限管理机制支持多种访问控制模型. Casbin只负责访问控制.身份认证 authentication(即验证用户 ...

  6. 怎么用Ubuntu系统制作Ubuntu系统盘

    ubuntu 16 下载地址: http://releases.ubuntu.com/16.04/?_ga=2.211639766.273896083.1564759714-49163328.1564 ...

  7. jQuery学习四——效果

    1.显示,隐藏: <!DOCTYPE html> <html> <head> <title>jquery事件</title> </he ...

  8. 前端接收 post 请求返回的文件

    坐标过多无法用Get请求,只能用post下载. 但发现ajax发送的post请求没有触发下载,返回的流媒体会存在于接口返回的response中. 查询发现AJAX并不会唤起浏览器的下载窗口,AJAX设 ...

  9. Asp.net SignalR 实现服务端消息实时推送到所有Web端

    ASP .NET SignalR是一个ASP .NET 下的类库,可以在ASP .NET 的Web项目中实现实时通信.实际上 Asp.net SignalR 2 实现 服务端消息推送到Web端, 更加 ...

  10. sas(Serial Attached SCSI)技术详解

    1.什么是SAS 即串行SCSI技术,是一种磁盘连接技术,它综合了并行SCSI和串行连接技术(FC,SSA,IEEE1394)的优势,以串行通讯协议为协议基础架构,采用SCSI-3扩展指令集,并兼容S ...