创建 StyledMapType 地图样式
您可以通过创建 StyledMapType
并向构造函数传递特征和样式器信息,新建作为样式应用对象的地图类型。此方法不会影响默认地图类型的样式。
如需新建地图类型:
- 创建您的样式数组。请参阅“地图特征和样式器”中的相关说明。
- 新建一个
google.maps.StyledMapType
对象,向其传递样式数组以及新地图类型的名称。 - 创建您的地图对象,然后在地图选项的
mapTypeIds
数组内加入新地图类型的标识符(它是mapTypeControlOptions
对象的一个属性)。 - 将上一步骤中的标识符与新样式化地图关联。
- 将地图设置为使用新地图类型。
function initialize() { // Create an array of styles.
var styles = [
{
stylers: [
{ hue: "#00ffe6" },
{ saturation: -20 }
]
},{
featureType: "road",
elementType: "geometry",
stylers: [
{ lightness: 100 },
{ visibility: "simplified" }
]
},{
featureType: "road",
elementType: "labels",
stylers: [
{ visibility: "off" }
]
}
]; // Create a new StyledMapType object, passing it the array of styles,
// as well as the name to be displayed on the map type control.
var styledMap = new google.maps.StyledMapType(styles,
{name: "Styled Map"}); // Create a map object, and include the MapTypeId to add
// to the map type control.
var mapOptions = {
zoom: 11,
center: new google.maps.LatLng(55.6468, 37.581),
mapTypeControlOptions: {
mapTypeIds: [google.maps.MapTypeId.ROADMAP, 'map_style']
}
};
var map = new google.maps.Map(document.getElementById('map'),
mapOptions); //Associate the styled map with the MapTypeId and set it to display.
map.mapTypes.set('map_style', styledMap);
map.setMapTypeId('map_style');
}
创建 StyledMapType 地图样式的更多相关文章
- google maps js v3 api教程(1) -- 创建一个地图
原文地址 google maps javascript官方文档:https://developers.google.com/maps/documentation/javascript/ 在创建地图之前 ...
- HTML5创建高德地图
创建高德地图 功能真的很好很强大,有图有证据! 1.申请key值 去官网2.https://webapi.amap.com/maps?v=1.4.11&key=e22196035aaa10db ...
- 用HMS Core地图服务自定义地图样式,给你的应用制作专属个性化地图
不同行业的开发者对地图样式的展示需求差异很大.例如,物流类应用希望地图样式简洁一些,重点突出城市分布和快递路径:AR游戏类应用中的地图色彩需要和游戏UI适配,做的更酷炫一些:景区导览应用中的地图样式要 ...
- OpenLayers 3 之 地图样式(ol.style)详解
地图样式是由 style 类控制的,其包含了地图样式的方方面面,例如,填充色.图标样式.图片样式.规则图形样式.边界样式.文字样式等,样式一般针对矢量要素图层. 矢量图层样式可以事先写好,写成静态的, ...
- 转载-SharePoint 2010 WebPart与Google地图系列 一:创建显示地图的WebPart
[原] SharePoint 2010 WebPart与Google地图系列 一:创建显示地图的WebPart 摘要: 作为信息化先驱的产品SharePoint 2010竟然对GIS相关技术支持如此有 ...
- [Swift通天遁地]一、超级工具-(10)使用地图视图MKMapView的相机功能实现创建三维地图
★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★➤微信公众号:山青咏芝(shanqingyongzhi)➤博客园地址:山青咏芝(https://www.cnblogs. ...
- SharePoint 创建网站地图树视图及格式枚举截图
SharePoint 创建网站地图树视图及格式枚举截图 SharePoint首页隐藏掉左側导航以后,假设要以树视图呈现站点地图也非常easy. 仅仅须要复制v4.mas ...
- [原] SharePoint 2010 WebPart与Google地图系列 一:创建显示地图的WebPart
摘要: 作为信息化先驱的产品SharePoint 2010竟然对GIS相关技术支持如此有限,试问现在哪个企业没有大量的项目需要结合Google地图来进行开发,单纯地从Google Javascript ...
- 【Leafletjs】1.创建一个地图
code: <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <l ...
随机推荐
- 混沌数学之离散点集图形DEMO
最近看了很多与混沌相关的知识,并写了若干小软件.混沌现象是个有意思的东西,同时混沌也能够生成许多有意思的图形.混沌学的现代研究使人们渐渐明白,十分简单的数学方程完全可以模拟系统如瀑布一样剧烈的行为.输 ...
- 数学图形(1.2)Sin曲线
相关软件参见:数学图形可视化工具,使用自己定义语法的脚本代码生成数学图形.该软件免费开源.QQ交流群: 367752815 Sin曲线 vertices = x = *PI) to (*PI) y = ...
- web 实时通信的方法总结
1.Web端即时通讯技术 即时通讯技术简单的说就是实现这样一种功能:服务器端可以即时地将数据的更新或变化反应到客户端,例如消息即时推送等功能都是通过这种技术实现的. 但是在Web中,由于浏览器的限制, ...
- CSS中英文字符两端对齐实现
两端对齐实现 一般加上下面2行就可实现 display: inline-block; text-align: justify; 但是对于中英文混杂的情况,中英文难一起实现对齐,原因在下面有分析,需要如 ...
- ElasticSearch关闭重启命令
很多人学习elasticSearch都是自学,想百度一下如何重启es也是没有答案,我硬着头皮,算是琢磨出来了,借此写博,希望能帮助您. 1.如何关闭ES,elasticsearch关闭办法 1.使用h ...
- 自定义UITableViewCell 的delete按钮
自定义UITableViewCell上的delete按钮 滑动列表行(UITableViewCell)出现删除按钮时,默认是英文“delete”,这份代码片段能够将“delete”变成中文”删除“,甚 ...
- win7系统下用vspd软件进行串口编程实例
http://blog.csdn.net/qiusuo800/article/details/8299777 目前,我在学习C#串口编程类的基础知识,在网上也找了一些资料,但都存在一些问题,现在他们基 ...
- Linux的网卡由eth0变成了eth1怎么办?
Linux的网卡由eth0变成了eth1怎么办? Linux的网卡由eth0变成了eth1,如何修复 使用wmware安装了linux,安装成功后,使用的网卡是eth0,没有eth1.但是用过一段时间 ...
- 解决/usr/lib/libstdc++.so.6: version `GLIBCXX_3.4.15' not found错误的解决
原因是没有GLIBCXX_3..15版本,或是更高的版本. 一.查看并下载 32位系统: [root@localhost ~]# strings /usr/lib/libstdc++.so. | gr ...
- Access denied with payslip工资条非同部门员工不能创建bug
Access Denied The requested operation cannot be completed due to security restrictions. Please conta ...