天天看點

Cesium系列:加載不規則形狀出圖

在Cesium地圖系統開發中,背景出圖的範圍,在經緯度中是一個不規則的polygon,出來的圖檔形狀也不是規則的,要在地圖上貼上這張圖,圖檔顯示的範圍也要契合到實際地圖位置。

圖檔效果:

Cesium系列:加載不規則形狀出圖

查找Cesium的接口,首先想到的是,用其中的polygon,按照經緯的範圍,畫一個polygon,再将圖檔做為材質material貼進去,不過代碼寫上後,發現的貼圖在polygon中變形了,也沒有貼到相應的地圖位置。

經過測試,最後發現可以用Cesium的Rectangle實體對象,通過計算出不規則多邊形四至範圍的左上角坐标和右下角坐标,再将圖檔材質貼上去,地圖上的位置還對上了。

具體的代碼如下:

//添加一個rectangle的實體

 viewer.entities.add({

        name: '不規則貼圖',

        rectangle: {

        //設定rectangle的四個坐标範圍

        coordinates: Cesium.Rectangle.fromDegrees(-92.0, 30.0, -76.0, 40.0), 

        //設定圖檔為材質

        material: 'data/wind_500_2018030616_True.png', 

        //圖檔顯示樣式類型,有地形,模型或者兩者,此效果可以達到貼圖是沿

        //地圖弧面的

        classificationType : Cesium.ClassificationType.TERRAIN

    }

添加完成後,效果是貼地的,形狀是長方形,但是空白地方顯示是黑色,要在材質裡單獨設定一下,把材質屬性改成如下:黑色沒有了

material: new Cesium.ImageMaterialProperty({

   image:'data/wind_500_2018030616_True.png',

   transparent:true

  })

//順便設定個高度屬性,可以離開地面顯示

height:70000

完成後效果圖:

繼續閱讀