# GeoJsonDataSource

vc-datasource-geojson 组件用于加载 GeoJSON (opens new window) 和 TopoJSON (opens new window) 格式的数据。

# 示例

# 加载 GeoJSON 格式数据源

# 预览

收起 
  <template>
    <div class="viewer">
      <vc-viewer @ready="ready" @MOUSE_MOVE="MOUSE_MOVE">
        <vc-datasource-geojson
          data="/statics/SampleData/lineData/streamline.json"
          @ready="subReady"
          :show="show"
          :options="options"
          ref="ds"
        ></vc-datasource-geojson>
      </vc-viewer>
    </div>
  </template>

  <script>
    export default {
      data() {
        return {
          show: true,
          options: {
            stroke: 'red'
          },
        }
      },
      methods: {
        ready(cesiumInstance) {
          this.cesiumInstance = cesiumInstance
          const { Cesium, viewer } = cesiumInstance
        },
        subReady(cesiumInstance) {
          cesiumInstance.viewer.zoomTo(cesiumInstance.cesiumObject)
        },
        MOUSE_MOVE (movement) {
          const { Cesium, viewer } = cesiumInstance
          // Pick a new feature
          var pickedFeature = viewer.scene.pick(movement.endPosition)
          if (!Cesium.defined(pickedFeature)) {
            return
          }
          console.log(pickedFeature)
        }
      }
    }
  </script>

# 属性

属性名 类型 默认值 描述
data String|Object required 指定要加载的 GeoJSON 或者 TopoJSON 的 url。
show Boolean true optional 指定数据源是否显示。
options Object optional 指定以下属性：
sourceUri String
markerSize Number
markerSymbol String
markerColor String|Object|Array
stroke String|Object|Array
strokeWidth Number
fill String|Object|Array
clampToGround Boolean false
credit String|Object

# 事件

事件名 参数 描述
ready {Cesium, viewer, cesiumObject} 该组件渲染完毕时触发，返回 Cesium 类, viewer 实例，以及当前组件的 cesiumObject。
changedEvent 数据源改变时触发。
errorEvent 数据源发生错误时触发。
loadingEvent 数据源开始或结束加载时触发。
clusterEvent (clusteredEntities, cluster) 数据源聚合事件。
collectionChanged (collection, added, removed, changed) 数据源实体集合改变时触发。

← Kml数据源 →