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

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

  

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. 36 Flutter仿京东商城项目 用户登录 退出登录 事件广播更新状态

    Login.dart import 'dart:convert'; import 'package:dio/dio.dart'; import 'package:flutter/material.da ...

  2. jquery iframe取得元素与自适应高度

    总结一下iframe在jquery中怎么操作的,下面我来给各位介绍jquery 获取iframe子/父页面的元素及iframe在jquery高度自适应实现方法,各位朋友可参考. jquery方法: 在 ...

  3. 创建.Net Core For WPF项目并且添加VS Code编译运行支持

    1.下载最新的Visual Studio 2019或者Preview版本,新建项目,找到"WPF App(.Net Core)"模板. 2.输入项目名称"NetCore- ...

  4. 使用Apache,压力测试redisson的一般高并发

    安装 Linux linux直接yum -y install httpd-tools,然后ab -V测试 Windows 1查看80端口有没有被占用,netstat -ano | findstr &q ...

  5. 微服务发展规划(PS 大概分层未细化到具体系统)

    网关层 标准化认证业务前台 前置HTML 基于VUE的浏览器端渲染等特性,完全可以看成一个独立的层业务中台 a. 各个系统的业务功能,以业务功能为单位拆分出的业务服务. b. 配合业务前台所产生的聚合 ...

  6. 最新 第一视频java校招面经 (含整理过的面试题大全)

    从6月到10月,经过4个月努力和坚持,自己有幸拿到了网易雷火.京东.去哪儿.第一视频等10家互联网公司的校招Offer,因为某些自身原因最终选择了第一视频.6.7月主要是做系统复习.项目复盘.Leet ...

  7. yarn和npm

    Yarn和npm命令对比 npm install === yarn npm install taco --save === yarn add taco npm uninstall taco --sav ...

  8. Spring Boot代码生成

    一.背景 在Java web开发中,虽然Spring boot已经帮助我们简化了很多工作,但项目中庞杂的业务仍然需要自己去编写较多的 entity,vo,Mapper,Service, Control ...

  9. C#中使用HttpClient来Post数据的内容HttpContent的各种格式

    平时使用各种网络传输的时候基本上是以Json格式进行的, 所以对其他几种格式也是一知半解, 今天静下心对其好好梳理一番. 首先我借鉴了一篇文章(https://segmentfault.com/a/1 ...

  10. [转帖]超能课堂(199) 接口渐趋统一,USB4又如何能引领变革?

    https://www.expreview.com/70414.html 接口协议真复杂.. 9月3日,USB IF正式公布了USB4(你没看错,就是USB4,没有空格)的技术规格.USB-IF表示, ...