imageryProvider option

[lighteninglin]

I want to achieve a function that like the content in the following link, but it did not work. https://www.jianshu.com/p/7b5476d8a7f6

[zouyaoji]

hi, two ways to make it works. 1、Use Cesium API.

<div class="content fixed">
   <cesium-viewer @ready=ready>
   </cesium-viewer>
</div>
methods: {
    ready (cesiumInstance) {
      let imageryProvider = cesiumInstance.Cesium.createTileMapServiceImageryProvider({
        url: 'https://cesiumjs.org/blackmarble',
        flipXY: true,
        credit: 'Black Marble imagery courtesy NASA Earth Observatory'
      })
      cesiumInstance.viewer.imageryLayers.removeAll()
      cesiumInstance.viewer.imageryLayers.addImageryProvider(imageryProvider, 0)
    }
  }

2、Update Vue-Cesium@0.05 and use Vue Propertie imageryProvider of cesium-viewerComponent .

<div class="content fixed">
  <cesium-viewer @ready=ready :imageryProvider="imageryProvider">
  </cesium-viewer>
</div>

data () {
    return {
      imageryProvider: null
    }
  },
  methods: {
    ready (cesiumInstance) {
      let imageryProvider = cesiumInstance.Cesium.createTileMapServiceImageryProvider({
        url: 'https://cesiumjs.org/blackmarble',
        flipXY: true,
        credit: 'Black Marble imagery courtesy NASA Earth Observatory'
      })
      this.imageryProvider = imageryProvider
    }
  }

Thanks.

总结一下。 因为这个组件还不成熟，没有提供别的组件，后面有时间了设计一下，提供点图层的组件，直接用图层组件加图层应该更方便一些。

[lighteninglin]

@zouyaoji Thank you.:+1: