流动建筑物(FlowBuildingLayer)
示例
示例源码
vue
<template>
<div class="map-container" style="background-color: gray">
<mb-map :zoom="15" :center="[116.17381, 39.92155464]" :pitch="60">
<mb-flow-building-layer
:data="__RESOURCE_URL__ + 'json/building.geojson'"
style-name="The Matrix"
:get-fill-color="[41, 107, 173]"
:data-transform="(d) => d.features"
:get-polygon="(d) => d.geometry.coordinates[0]"
:get-elevation="50"
/>
</mb-map>
</div>
</template>
<script setup lang="ts"></script>
API
PROPS
名称 | 描述 | 类型 | 默认值 |
---|---|---|---|
id | 图层Id | string | - |
style-name | - | string | The Matrix |
get-elevation | - | number / AnyNumberFunc | 1000 |
get-fill-color | - | number[] / AnyFunc | [0, 125, 125] |
get-polygon | - | AnyFunc | - |
elevation-scale | - | number | 1 |
data | 图层源数据 | string / IndexAny / AnyArr / Promise<any> | '' |
show | 是否显示 | boolean | true |
opacity | 透明度 | number | 1 |
pickable | 图层是否会响应鼠标事件,若为false,则组件不会emit鼠标相关事件 | boolean | false |
auto-highlight | 本属性为true且pickable为true时,则会将鼠标悬浮选中的对象设为高亮 | boolean | false |
highlight-color | 要与高亮对象原始颜色进行混合(blend)的颜色值 | string / number[] | [255, 255, 128, 1] |
highlighted-object-index | 高亮元素序号 | number | -1 |
on-data-load | - | AnyFunc | - |
data-transform | - | AnyFunc | - |
transitions | - | IndexAny | {} |
EVENTS
名称 | 描述 | 参数 |
---|
SLOTS
名称 | 描述 |
---|
METHODS
名称 | 描述 | 定义 |
---|