使用 CZML 文件中的 3D 模型移动对象
using 3D models in CZML file to move an object
我正在创建一个 CZML 文件,我有一条路径,我希望我的对象遵循该路径并逐个位置移动(我根据时间纪元定义了位置。)
它与带有图像的广告牌完美配合,但是当我更改我的代码以拥有模型时,例如 sandcastle 中的 3D 模型之一,而不是广告牌,它不起作用。它甚至不显示模型。我只有一个标签,在路径上移动,但没有模型的迹象。
问题是什么?我非常想在 CZML 文件中使用 3D 模型,而不是在 javaScript 中。如果有人能帮助我,我会很高兴。
我将我的数据保存在 .czml 文件中,然后我将通过 javaScript 将它们加载到 html 中,如下所示:
viewer.dataSources.add(Cesium.CzmlDataSource.load('../../SampleData/fstsp_solution.czml'));
我的 czml 文件的副本是:
[
{
"id":"document",
"version":"1.0"
},
{
"id":"Vehicle",
"availability":"2012-08-04T16:00:00Z/2012-08-04T17:04:54.9962195740191Z",
"model":{
"show":true,
"gltf":"../../SampleData/models/CesiumMilkTruck/CesiumMilkTruck.bgltf",
"scale":2,
"minimumPixelSize":25
},
"oriantation":{
"interpolationAlgorithm":"LAGRANGE",
"interpolationDegree":1,
"epoch":"2012-08-04T16:00:00Z",
"unitQuaternion":[some numbers, I am working on it]
},
"position":{
"interpolationAlgorithm":"LAGRANGE",
"interpolationDegree":1,
"epoch":"2012-08-04T16:00:00Z",
"cartographicDegrees":[time,long,lat,height,time,long,lat,height,time,long,lat,height]
}
}
]
谢谢
有一个奇怪的地方 ModelGraphics 调用 uri
参数,但 CzmlDataSource 加载器在 CZML 文件中通过名称 gltf
查找此 属性。不确定这 is/was 是否是故意的。在任何情况下,如果您使用正确的名称,您都可以让模型显示在 CZML 文件中。我下面的示例缺少正确的模型方向,但显示模型已加载。
尝试加载 Sandcastle 并将以下内容粘贴到代码编辑器中,然后按 运行 (F8)。
var viewer = new Cesium.Viewer('cesiumContainer');
var builtInCzml = [{
"id" : "document",
"version" : "1.0",
"clock" : {
"interval" : "2012-08-04T16:00:00Z/2012-08-04T16:02:00Z",
"currentTime" : "2012-08-04T16:00:00Z",
"multiplier" : 1,
"range" : "LOOP_STOP",
"step" : "SYSTEM_CLOCK_MULTIPLIER"
}
}, {
"id" : "Vehicle",
"availability" : "2012-08-04T16:00:00Z/2012-08-04T16:02:00Z",
"model" : {
"show" : true,
"gltf" : "../../SampleData/models/CesiumGround/Cesium_Ground.bgltf"
},
"billboard" : {
"eyeOffset" : {
"cartesian" : [0.0, 0.0, 0.0]
},
"horizontalOrigin" : "CENTER",
"image" : "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAEISURBVEhLvVXBDYQwDOuojHKj8LhBbpTbpBCEkZsmIVTXq1RVQGrHiWlLmTTqPiZBlyLgy/KSZQ5JSHDQ/mCYCsC8106kDU0AdwRnvYZArWRcAl0dcYJq1hWCb3hBrumbDAVMwAC82WoRvgMnVMDBnB0nYZFTbE6BBvdUGqVqCbjBIk3PyFFR/NU7EKzru+qZsau3ryPwwCRLKYOzutZuCL6fUmWeJGzNzL/RxAMrUmASSCkkAayk2IxPlwhAAYGpsiHQjbLccfdOY5gKkCXAMi7SscAwbQpAnKyctWyUZ6z8ja3OGMepwD8asz+9FnSvbhU8uVOHFIwQsI3/p0CfhuqCSQuxLqsN6mu8SS+N42MAAAAASUVORK5CYII=",
"pixelOffset" : {
"cartesian2" : [0.0, 0.0]
},
"scale" : 0.8,
"show" : true,
"verticalOrigin" : "BOTTOM"
},
"label" : {
"fillColor" : {
"rgba" : [255, 255, 0, 255]
},
"font" : "bold 10pt Segoe UI Semibold",
"horizontalOrigin" : "LEFT",
"outlineColor" : {
"rgba" : [0, 0, 0, 255]
},
"pixelOffset" : {
"cartesian2" : [10.0, 0.0]
},
"scale" : 1.0,
"show" : true,
"style" : "FILL",
"text" : "Vehicle",
"verticalOrigin" : "CENTER"
},
"path" : {
"material" : {
"solidColor" : {
"color" : {
"rgba" : [255, 255, 0, 255]
}
}
},
"width" : 5.0,
"show" : true
},
"position" : {
"interpolationAlgorithm" : "LAGRANGE",
"interpolationDegree" : 1,
"epoch" : "2012-08-04T16:00:00Z",
"cartesian" : [0.0, 1254962.0093268978, -4732330.528380746, 4074172.505865612,
120.0, 1256995.7322857284, -4732095.2154790815, 4073821.2249589274]
}
}];
var czmlDataSource = new Cesium.CzmlDataSource();
czmlDataSource.load(builtInCzml, 'Sample CZML with 3D model');
viewer.dataSources.add(czmlDataSource);
viewer.trackedEntity = czmlDataSource.entities.getById('Vehicle');
我发现了问题,我没有在我的电脑上给它找到模型的正确位置,当我使用我的本地主机时,我实际上应该从我的本地主机或 Cesium 地址中给它完整的地址,所以我应该输入它
"gltf":"../../Apps/SampleData/models/CesiumMilkTruck/CesiumMilkTruck.bgltf",
而不仅仅是给它地址
"../../SampleData/models/CesiumMilkTruck/CesiumMilkTruck.bgltf",
现在可以使用了,感谢所有帮助过的人!
仅供参考 - 如果您要使用 uri 路由,则必须包括 https
我正在创建一个 CZML 文件,我有一条路径,我希望我的对象遵循该路径并逐个位置移动(我根据时间纪元定义了位置。)
它与带有图像的广告牌完美配合,但是当我更改我的代码以拥有模型时,例如 sandcastle 中的 3D 模型之一,而不是广告牌,它不起作用。它甚至不显示模型。我只有一个标签,在路径上移动,但没有模型的迹象。
问题是什么?我非常想在 CZML 文件中使用 3D 模型,而不是在 javaScript 中。如果有人能帮助我,我会很高兴。
我将我的数据保存在 .czml 文件中,然后我将通过 javaScript 将它们加载到 html 中,如下所示:
viewer.dataSources.add(Cesium.CzmlDataSource.load('../../SampleData/fstsp_solution.czml'));
我的 czml 文件的副本是:
[
{
"id":"document",
"version":"1.0"
},
{
"id":"Vehicle",
"availability":"2012-08-04T16:00:00Z/2012-08-04T17:04:54.9962195740191Z",
"model":{
"show":true,
"gltf":"../../SampleData/models/CesiumMilkTruck/CesiumMilkTruck.bgltf",
"scale":2,
"minimumPixelSize":25
},
"oriantation":{
"interpolationAlgorithm":"LAGRANGE",
"interpolationDegree":1,
"epoch":"2012-08-04T16:00:00Z",
"unitQuaternion":[some numbers, I am working on it]
},
"position":{
"interpolationAlgorithm":"LAGRANGE",
"interpolationDegree":1,
"epoch":"2012-08-04T16:00:00Z",
"cartographicDegrees":[time,long,lat,height,time,long,lat,height,time,long,lat,height]
}
}
]
谢谢
有一个奇怪的地方 ModelGraphics 调用 uri
参数,但 CzmlDataSource 加载器在 CZML 文件中通过名称 gltf
查找此 属性。不确定这 is/was 是否是故意的。在任何情况下,如果您使用正确的名称,您都可以让模型显示在 CZML 文件中。我下面的示例缺少正确的模型方向,但显示模型已加载。
尝试加载 Sandcastle 并将以下内容粘贴到代码编辑器中,然后按 运行 (F8)。
var viewer = new Cesium.Viewer('cesiumContainer');
var builtInCzml = [{
"id" : "document",
"version" : "1.0",
"clock" : {
"interval" : "2012-08-04T16:00:00Z/2012-08-04T16:02:00Z",
"currentTime" : "2012-08-04T16:00:00Z",
"multiplier" : 1,
"range" : "LOOP_STOP",
"step" : "SYSTEM_CLOCK_MULTIPLIER"
}
}, {
"id" : "Vehicle",
"availability" : "2012-08-04T16:00:00Z/2012-08-04T16:02:00Z",
"model" : {
"show" : true,
"gltf" : "../../SampleData/models/CesiumGround/Cesium_Ground.bgltf"
},
"billboard" : {
"eyeOffset" : {
"cartesian" : [0.0, 0.0, 0.0]
},
"horizontalOrigin" : "CENTER",
"image" : "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAEISURBVEhLvVXBDYQwDOuojHKj8LhBbpTbpBCEkZsmIVTXq1RVQGrHiWlLmTTqPiZBlyLgy/KSZQ5JSHDQ/mCYCsC8106kDU0AdwRnvYZArWRcAl0dcYJq1hWCb3hBrumbDAVMwAC82WoRvgMnVMDBnB0nYZFTbE6BBvdUGqVqCbjBIk3PyFFR/NU7EKzru+qZsau3ryPwwCRLKYOzutZuCL6fUmWeJGzNzL/RxAMrUmASSCkkAayk2IxPlwhAAYGpsiHQjbLccfdOY5gKkCXAMi7SscAwbQpAnKyctWyUZ6z8ja3OGMepwD8asz+9FnSvbhU8uVOHFIwQsI3/p0CfhuqCSQuxLqsN6mu8SS+N42MAAAAASUVORK5CYII=",
"pixelOffset" : {
"cartesian2" : [0.0, 0.0]
},
"scale" : 0.8,
"show" : true,
"verticalOrigin" : "BOTTOM"
},
"label" : {
"fillColor" : {
"rgba" : [255, 255, 0, 255]
},
"font" : "bold 10pt Segoe UI Semibold",
"horizontalOrigin" : "LEFT",
"outlineColor" : {
"rgba" : [0, 0, 0, 255]
},
"pixelOffset" : {
"cartesian2" : [10.0, 0.0]
},
"scale" : 1.0,
"show" : true,
"style" : "FILL",
"text" : "Vehicle",
"verticalOrigin" : "CENTER"
},
"path" : {
"material" : {
"solidColor" : {
"color" : {
"rgba" : [255, 255, 0, 255]
}
}
},
"width" : 5.0,
"show" : true
},
"position" : {
"interpolationAlgorithm" : "LAGRANGE",
"interpolationDegree" : 1,
"epoch" : "2012-08-04T16:00:00Z",
"cartesian" : [0.0, 1254962.0093268978, -4732330.528380746, 4074172.505865612,
120.0, 1256995.7322857284, -4732095.2154790815, 4073821.2249589274]
}
}];
var czmlDataSource = new Cesium.CzmlDataSource();
czmlDataSource.load(builtInCzml, 'Sample CZML with 3D model');
viewer.dataSources.add(czmlDataSource);
viewer.trackedEntity = czmlDataSource.entities.getById('Vehicle');
我发现了问题,我没有在我的电脑上给它找到模型的正确位置,当我使用我的本地主机时,我实际上应该从我的本地主机或 Cesium 地址中给它完整的地址,所以我应该输入它
"gltf":"../../Apps/SampleData/models/CesiumMilkTruck/CesiumMilkTruck.bgltf",
而不仅仅是给它地址
"../../SampleData/models/CesiumMilkTruck/CesiumMilkTruck.bgltf",
现在可以使用了,感谢所有帮助过的人!
仅供参考 - 如果您要使用 uri 路由,则必须包括 https