cesium vue Material设置材质

QQ交流群：607330463 GIS开发技术最强交流群   未经允许 禁止转载  可以参考

 1.如图所示

2.代码参考

<template>
  <div id="cesiumContainer"></div>
</template>
<script>
import "cesium/Build/Cesium/Widgets/widgets.css";
import * as Cesium from "cesium";

export default {
  name: "Map",
  mounted() {
    this.init();
  },
  methods: {
    init() {
      var viewer = new Cesium.Viewer("cesiumContainer");
      //方法一，构造时赋材质,并用新建一个entity实现指向viewer.entities
      var entity = viewer.entities.add({
        position: Cesium.Cartesian3.fromDegrees(-103.0, 40.0),
        ellipse: {
          semiMinorAxis: 250000.0,//短半轴
          semiMajorAxis: 400000.0,//长半轴
          material: Cesium.Color.RED.withAlpha(0.5), //可设置不同的MaterialProperty
        },
      });

      //方法二，构造后再赋材质颜色
      var ellipse = entity.ellipse;
      ellipse.material = Cesium.Color.BLUE;
    },
  },
};
</script>
<style lang="scss" scoped>
#cesiumContainer {
  width: 100vw;
  height: 100vh;
  margin: 0;
  padding: 0;
  overflow: hidden;
}
</style>