Skip to content

FlowBuildingLayer

Example

Example Source Code
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

NameDescriptionTypeDefault
idLayer IDstring-
style-nameStyle name.string'The Matrix'
get-elevationFunction to retrieve the elevation value.number / AnyNumberFunc1000
get-fill-colorFunction to retrieve the fill color.number[] / AnyFunc[0, 125, 125]
get-polygonFunction to retrieve the polygon data.AnyFunc-
elevation-scaleA scaling factor applied to the elevation values.number1
dataSource data for the layer.string / IndexAny / AnyArr / Promise<any>''
showWhether the layer is visible.booleantrue
opacityThe opacity of the layer (0-1).number1
pickableWhether the layer responds to mouse events. If false, the component will not emit mouse-related events.booleanfalse
auto-highlightWhen this property is true and pickable is also true, the hovered object will be highlighted.booleanfalse
highlight-colorThe color to blend with the original color of the highlighted object.string / number[][255, 255, 128, 1]
highlighted-object-indexThe index of the currently highlighted element.number-1
on-data-loadCallback function invoked after data loading is complete.AnyFunc-
data-transformFunction to transform the data before rendering.AnyFunc-
transitionsTransition settings for the layer.IndexAny{}

EVENTS

NameDescriptionParameters

SLOTS

NameDescription

METHODS

NameDescriptionDefinition