Tutorial: Bagaimana untuk menetapkan warna ellipsoid dalam dokumen CZML?

Question

Bagaimana untuk menentukan warna ellipsoid dalam CZML?当我在JavaScript中向查看器添加实体时，以下代码片段有效：

let redEllipsoid = viewer.entities.add({
  "nama": "ellipsoid merah",
  "kedudukan": Cesium.Cartesian3.fromDegrees(-114.0, 40.0, 300000.0),
  "ellipsoid": {
    "jejari": Cesium.Cartesian3 baharu(200000.0, 200000.0, 300000.0),
    "bahan": Cesium.Color.RED.withAlpha(0.5),
    "garis besar": benar,
    "outlineColor": Cesium.Color.BLACK
  }
});

这个代码片段也有效：

let redEllipsoid = viewer.entities.add({
  "nama": "ellipsoid merah",
  "kedudukan": {
    x: -2083516.9683773473,
    y: -4679655.730028949,
    z: 4270821.855106338
  },
  "ellipsoid": {
    "radii": {
      x: 200000,
      y: 200000,
      z: 300000
    },
    "bahan": Cesium.Color.RED.withAlpha(0.5),
    "garis besar": benar,
    "warna garisan": {
      merah: 0,
      hijau: 0,
      biru: 0,
      alfa: 1
    }
  }
});

但是这个代码片段无效（返回默认的白色椭球）：

let redEllipsoid = viewer.entities.add({
  "nama": "ellipsoid merah",
  "kedudukan": {
    x: -2083516.9683773473,
    y: -4679655.730028949,
    z: 4270821.855106338
  },
  "ellipsoid": {
    "radii": {
      x: 200000,
      y: 200000,
      z: 300000
    },
    "bahan": {
      "Warna pepejal": {
        "warna": {
          "rgba": [1, 0, 0, 0.5]
        }
      }
    },
    "garis besar": benar,
    "warna garisan": {
      merah: 0,
      hijau: 0,
      biru: 0,
      alfa: 1
    }
  }
});

这个代码片段也无效（返回默认的白色椭球）：

let redEllipsoid = viewer.entities.add({
  "nama": "ellipsoid merah",
  "kedudukan": {
    x: -2083516.9683773473,
    y: -4679655.730028949,
    z: 4270821.855106338
  },
  "ellipsoid": {
    "radii": {
      x: 200000,
      y: 200000,
      z: 300000
    },
    "bahan": {
      "warna": {
        merah: 1,
        hijau: 0,
        biru: 0,
        alfa: 0.5
      }
    },
    "garis besar": benar,
    "warna garisan": {
      merah: 0,
      hijau: 0,
      biru: 0,
      alfa: 1
    }
  }
});

Coretan kod ini juga tidak berfungsi (mengembalikan elipsoid putih lalai):

let redEllipsoid = viewer.entities.add({
  "nama": "ellipsoid merah",
  "kedudukan": {
    x: -2083516.9683773473,
    y: -4679655.730028949,
    z: 4270821.855106338
  },
  "ellipsoid": {
    "radii": {
      x: 200000,
      y: 200000,
      z: 300000
    },
    "bahan": {
      merah: 1,
      hijau: 0,
      biru: 0,
      alfa: 0.5
    },
    "garis besar": benar,
    "warna garisan": {
      merah: 0,
      hijau: 0,
      biru: 0,
      alfa: 1
    }
  }
});

Saya keliru kerana menaip Cesium.Color.RED.withAlpha(0.5) ke dalam konsol selepas Cesium dimuatkan mengembalikan ne {red: 1, green: 0 , biru: 0, alfa: 0.5}. Seseorang akan menjangkakan bahawa objek yang ditentukan oleh ahli statik tertentu akan berfungsi...

Ini ialah jenis "bahan". Oleh kerana ia adalah kelas abstrak tanpa atribut, adakah saya tidak dapat menentukannya melalui CZML? Ia akan menjadi sangat rumit jika menetapkan warna ellipsoid hanya boleh dilakukan melalui pemprosesan pasca, kerana saya ingin dapat melakukan banyak pemprosesan di luar talian dan kemudian hanya memuatkan CZML dalam penyemak imbas.

EDIT: Dokumentasi CZML sukar dicari dan dinavigasi, tetapi jawapan yang jelas semuanya ada:

Lihat halaman Ellipsoid Bahan, SolidColorMaterial halaman, dan secara pilihan halaman RgbaValue Ia diformatkan sebagai wiki GitHub, dengan halaman untuk setiap projek, dan malangnya kebanyakan projek dokumentasi disembunyikan sehingga anda mengklik "Tunjukkan 128 halaman lagi".

Answer 1

Masalahnya ialah Entity.ConstructorOptions yang diterima oleh EntityCollection.add(...) adalah serupa dalam beberapa cara kepada CZML, tetapi mempunyai beberapa perbezaan yang jelas. Beberapa coretan kod kerja pertama anda dalam soalan menggunakan ConstructorOptions dengan betul, tetapi ia tidak mengendalikan warna dan kedudukan sama seperti CZML.

Untuk menukar kod kepada format CZML asal, anda boleh menggunakan CzmlDataSource.load(...) pada kandungan CZML. Contohnya: Sandcastle Live Demo

const czml = [
  {
    id: "document",
    version: "1.0",
  },
  {
    "id": "red ellipsoid",
    "name": "red ellipsoid",
    "position": {
      "cartesian": [
        -2083516.9683773473,
        -4679655.730028949,
        4270821.855106338
      ]
    },
    "ellipsoid": {
      "radii": {
        "cartesian": [
          200000,
          200000,
          300000
        ]
      },
      "material": {
        "solidColor": {
          "color": {
            "rgba": [255, 0, 0, 128]
          }
        }
      },
      "outline": true,
      "outlineColor": {
        red: 0,
        green: 0,
        blue: 0,
        alpha: 1
      }
    }    
  },
];

const viewer = new Cesium.Viewer("cesiumContainer");
const dataSourcePromise = Cesium.CzmlDataSource.load(czml);
viewer.dataSources.add(dataSourcePromise);
viewer.zoomTo(dataSourcePromise);