开发 geohub 数据中心 数据发布服务 在地图JS API调用数据集

在地图JS API调用数据集 最后更新时间: 2022年08月08日

为了满足基于矢量瓦片的数据可视化需求,JSAPI 通过 AMap.MapboxVectorTileLayer 插件引入了矢量瓦片渲染支持,此图层可以使用标准的 MVT 瓦片服务作为数据源。然而,搭建一个MVT瓦片服务并非易事,我们往往会在数据存储、服务运维等方面耗费额外的心力。因此,GeoHUB 提供了「数据发布服务」功能,用户无需耗费心力,仅需对现有的数据集进行服务发布操作,即可快速搭建起MVT瓦片服务。

使用方式一:

  1. 在「数据发布服务」对数据集进行服务发布,获取服务ID
  2. 在「控制台」 添加Key,服务平台选择“Web服务”(已添加则跳过),获得Web服务Key
  3. 将上述ID和Key作为参数初始化瓦片图层
new AMap.MapboxVectorTileLayer({
  url: 'https://restapi.amap.com/rest/lbs/geohub/tiles/mvt?z=[z]&x=[x]&y=[y]&size=512&key=<Web服务Key>&id=<服务ID>',
  ...
});

注意:使用高德数据平台发布服务,由于服务 URL 地址是明文,强烈建议自行做服务代理转发,防止服务 ID 和 Key 明文传输导致数据泄露。

完整代码请移步MVT图层示例

使用方式二:

  1. 在「数据发布服务」对数据集进行服务发布,获取服务ID
  2. 将上述ID作为参数初始化瓦片图层,此时Web服务将默认使用JSAPI的Key
new AMap.MapboxVectorTileLayer({
  url: 'amap://mvt/<服务ID>',
  ...
});

参数说明

opts (MapboxVTLayerOptions) 图层初始化参数

Name

Description

opts.zIndex Number(default 80)

图层的层级

opts.opacity Number(default 1)

图层透明度

opts.url String?

MVT 数据的链接地址

opts.visible Boolean(default true)

图层是否可见

opts.zooms [numbernumber](default [2,22])

图层缩放等级范围

opts.dataZooms [numbernumber] (default [2,18])

瓦片数据等级范围,超过范围会使用最大/最小等级的数据

opts.styles MapboxVTLayerStyle

opts.styles.polygon PolygonStyle?

面类型的样式

opts.styles.polygon.color (StringFunction)?

面填充颜色

opts.styles.polygon.borderWidth (NumberFunction)?

描边宽度

opts.styles.polygon.dash (Array<Number> | Function)?

描边线的虚线配置,例如: [10,5,8,5]

opts.styles.polygon.borderColor (StringFunction)?

描边颜色

opts.styles.polygon.injection Array<Any>?

其他属性值中对于函数形式的值,假如需要获取外部变量,要使用数组的形式传入,便于在函数内部访问外部变量。请看下面的示例。

opts.styles.polygon.visible (BooleanFunction)?

是否显示

opts.styles.line LineStyle?

线类型数据的样式

opts.styles.line.color (StringFunction)?

线填充颜色

opts.styles.line.lineWidth (NumberFunction)?

宽度

opts.styles.line.dash (StringFunction)?

虚线配置,例如: [10,5,8,5]

opts.styles.line.injection Array<Any>?

其他属性值中对于函数形式的值,假如需要获取外部变量,要使用数组的形式传入,便于在函数内部访问外部变量。请看下面的示例。

opts.styles.line.visible (BooleanFunction)?

是否显示

opts.styles.point PointStyle?

点类型数据的样式

opts.styles.point.radius (StringFunction)?

圆点的半径,单位像素

opts.styles.point.color (NumberFunction)?

圆的填充颜色

opts.styles.point.borderWidth (StringFunction)?

描边的宽度

opts.styles.point.borderColor (StringFunction)?

描边的颜色

opts.styles.point.injection Array<Any>?

其他属性值中对于函数形式的值,假如需要获取外部变量,要使用数组的形式传入,便于在函数内部访问外部变量。请看下面的示例。

opts.styles.point.visible (BooleanFunction)?

是否显示

opts.styles.polyhedron PolyheronStyle?

多面体类型的样式

opts.styles.polyhedron.topColor (StringFunction)?

顶面填充颜色

opts.styles.polyhedron.sideColor (StringFunction)?

侧面填充颜色

opts.styles.polyhedron.texture (StringFunction)?

侧面纹理,纹理优先展示,没有纹理时使用填充颜色

opts.styles.polyhedron.injection Array<Any>?

其他属性值中对于函数形式的值,假如需要获取外部变量,要使用数组的形式传入,便于在函数内部访问外部变量。请看下面的示例。

opts.styles.polyhedron.visible (BooleanFunction)?

是否显示

   

成员函数:

函数

说明

功能

setStyles(styles)

参数 styles (MapboxVTLayerStyle) 样式信息

设置样式信息

filterByPolygon(rect)

参数 rect (Polygon) 多边型;返回值为 Array<Feature>

获取 rect 范围的features

getStyles()

返回值为 MapboxVTLayerStyle

获取样式信息

getOptions()

返回值为 图层参数信息 (object)

获取图层参数信息

getzIndex()

返回值为 图层层级 (number)

获取图层层级

setzIndex(zIndex)

参数 zIndex (number图层层级值

设置图层层级,数字越大图层层级越高

getOpacity()

返回值为 图层透明度 (number)

获取图层透明度

setOpacity(opacity)

参数 opacity (number图层透明度

设置图层透明度,范围 [0 ~ 1]

getZooms()

返回值为 缩放范围 ([numbernumber])

获取该图层可显示的级别范围,默认取值范围为[2-20]

setZooms(zooms)

参数 zooms ([numbernumber]) 缩放范围

获取该图层可显示的级别范围

show()

-

设置图层可见

hide()

-

设置图层隐藏

   

参考: AMap.MapboxVectorTileLayer

返回顶部 示例中心 常见问题 智能客服 公众号
二维码