javascript - 具有多个图层的自定义 map 类型

标签 javascript google-maps google-maps-api-3

我正在使用谷歌地图v3 javascript api,并且我尝试根据google.develper上的指南创建自定义 map 类型.

但是我发现 map 类型仅提供一层,而我的自定义 map 类型应提供两层,就像包含两层的 google.maps.MapTypeId.HYBRID - SATELLITE 地名

所以我想知道这是否可能?

BWT,我有关于 map 类型和图层的问题here .

似乎 map 类型是由图层组成的,这是真的吗?

<小时/>

事实上,我的第一个问题已经由 Michael Geary 解决了。

但是,我现在遇到了新问题,因为它仍然与自定义 map 类型相关,所以我更新这篇文章而不是创建新问题。

第二季度:

如果我有多个图层,那么 map 类型控件怎么样?

如您所见,google.maps.mapTypeId.HYBRID 有两层——卫星层和标签层。

所以在 map 类型控件中你会发现:

enter image description here

注意标签复选框。

现在我的自定义 map 类型有两个图层 - baselabels,如何使 labels 图层可以切换?

最佳答案

自定义 map 类型为每个图 block 定义一个 DOM 元素,as described here 。该 DOM 元素不仅限于单个图像。您可以拥有<div>其中嵌套有任意数量的图像和其他元素。

混合 map 类型就是通过这种方法实现的。以下是 Chrome DOM 检查器的屏幕截图,显示混合卫星 View 中的单个 map 图 block :

Hybrid map tile DOM elements

如您所见,<div>有两个 <img> children 。第一个,由 khms0.googleapis.com 提供,是基础卫星图 block 图像。第二个,由 mts0.googleapis.com 提供,是标签和边框覆盖具有透明背景的图 block 。就 Maps API 而言,这只是单一 map 类型:API 只了解容器 <div> ,而不是其中的图像。

base map exampleBase Map Types文档的部分说明了 <div> 的使用元素作为 map 图 block 。您可以使用它作为起点并添加您的 <img> <div>内的瓷砖.

关于javascript - 具有多个图层的自定义 map 类型,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17606458/

相关文章:

javascript - Antd RangePicker 无法为 Time 设置 12 小时格式

javascript - Google Chrome 中的 Canvas 点击区域是否仍然可用?

javascript - 唯一标识重复的 Chrome 标签页

ios - 在 IOS 的文本字段中自动完成 Google Places

javascript - selenium js webdriver.By

ios - GMS 室内显示器 : How to force the change to an specific floor

android - 在 android 中使用 google direction api 进行 GPS 跟踪

javascript - OpenLayers 谷歌地图调整大小问题

javascript - Google Maps API - 如何仅绘制第一个和最后一个标记

iOS - 具有 100 多个坐标的 Snap To Road API