指南:如何在CZML文档中设定椭球体的色彩?
P粉162773626
P粉162773626 2023-09-04 00:02:30
[JavaScript讨论组]

如何在CZML中指定椭球的颜色?当我在JavaScript中向查看器添加实体时,以下代码片段有效:

let redEllipsoid = viewer.entities.add({
  "name": "red ellipsoid",
  "position": Cesium.Cartesian3.fromDegrees(-114.0, 40.0, 300000.0),
  "ellipsoid": {
    "radii": new Cesium.Cartesian3(200000.0, 200000.0, 300000.0),
    "material": Cesium.Color.RED.withAlpha(0.5),
    "outline": true,
    "outlineColor": Cesium.Color.BLACK
  }
});

这个代码片段也有效:

let redEllipsoid = viewer.entities.add({
  "name": "red ellipsoid",
  "position": {
    x: -2083516.9683773473,
    y: -4679655.730028949,
    z: 4270821.855106338
  },
  "ellipsoid": {
    "radii": {
      x: 200000,
      y: 200000,
      z: 300000
    },
    "material": Cesium.Color.RED.withAlpha(0.5),
    "outline": true,
    "outlineColor": {
      red: 0,
      green: 0,
      blue: 0,
      alpha: 1
    }
  }
});

但是这个代码片段无效(返回默认的白色椭球):

let redEllipsoid = viewer.entities.add({
  "name": "red ellipsoid",
  "position": {
    x: -2083516.9683773473,
    y: -4679655.730028949,
    z: 4270821.855106338
  },
  "ellipsoid": {
    "radii": {
      x: 200000,
      y: 200000,
      z: 300000
    },
    "material": {
      "solidColor": {
        "color": {
          "rgba": [1, 0, 0, 0.5]
        }
      }
    },
    "outline": true,
    "outlineColor": {
      red: 0,
      green: 0,
      blue: 0,
      alpha: 1
    }
  }
});

这个代码片段也无效(返回默认的白色椭球):

let redEllipsoid = viewer.entities.add({
  "name": "red ellipsoid",
  "position": {
    x: -2083516.9683773473,
    y: -4679655.730028949,
    z: 4270821.855106338
  },
  "ellipsoid": {
    "radii": {
      x: 200000,
      y: 200000,
      z: 300000
    },
    "material": {
      "color": {
        red: 1,
        green: 0,
        blue: 0,
        alpha: 0.5
      }
    },
    "outline": true,
    "outlineColor": {
      red: 0,
      green: 0,
      blue: 0,
      alpha: 1
    }
  }
});

这个代码片段也无效(返回默认的白色椭球):

let redEllipsoid = viewer.entities.add({
  "name": "red ellipsoid",
  "position": {
    x: -2083516.9683773473,
    y: -4679655.730028949,
    z: 4270821.855106338
  },
  "ellipsoid": {
    "radii": {
      x: 200000,
      y: 200000,
      z: 300000
    },
    "material": {
      red: 1,
      green: 0,
      blue: 0,
      alpha: 0.5
    },
    "outline": true,
    "outlineColor": {
      red: 0,
      green: 0,
      blue: 0,
      alpha: 1
    }
  }
});

我感到困惑,因为在Cesium加载后将 Cesium.Color.RED.withAlpha(0.5) 输入控制台会返回 ne {red: 1, green: 0, blue: 0, alpha: 0.5}。人们会期望给定静态成员指定的对象会起作用...

这是 "material" 的类型。由于它是一个没有属性的抽象类,我是否无法通过CZML指定它?如果设置椭球的颜色只能通过后处理来完成,那将是非常麻烦的,因为我希望能够离线进行大量的处理,然后只需在浏览器中加载CZML。

编辑:CZML文档很难找到和导航,但直接的答案都在那里:

请参阅CZML文档的 Ellipsoid 页面、Material 页面、SolidColorMaterial 页面、Color 页面,以及可选的 RgbaValue 页面。它的格式是一个GitHub wiki,每个项目都有一个页面,不幸的是,大部分文档项目都隐藏起来,直到你点击“显示128个更多页面”。

P粉162773626
P粉162773626

全部回复(1)
P粉009828788

问题在于EntityCollection.add(...)接受的Entity.ConstructorOptions与CZML在某些方面是相似的,但又有一些明显的不同。你在问题中的前几个工作代码片段正确地使用了ConstructorOptions,但它们的处理颜色和位置的方式与CZML并不完全相同。

要将代码转换为原始的CZML格式,可以在CZML内容上使用CzmlDataSource.load(...)。例如:Sandcastle实时演示

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);

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号