Question

这个问题与这两个问题有关：

Cesium how to scale a polygon to match Lat-Lon positions while zoom-in/zoom-out
Cesium - using camera to scale a polygon to match Lat-Lon positions while zoom-in/zoom-out

我从相机获取lat-lon-alt位置的示例代码位于gold standard that appears to be baked into the existing camera controller。使用此代码，我可以从相机的距离检索lat-lon-alt位置，以获得几乎与所选原始lat-lon位置和地球表面之上的高度完全相同的值。完美！

所有示例和文档都显示使用度数或点数创建多边形。

现在怎样？也许我错过了一些东西，但我想的是能够使用特定的x，y，z坐标创建多边形，这样多边形就会“放大”到我家的顶部放大，缩小和相机运动。现在我有了这些值，用这些值绘制多边形的秘诀是什么？

仅供参考，这些是我目前拥有的价值：

=========================新信息================= ==========

redPolygon的代码有效：

var redPolygon = viewer.entities.add({
    name : 'Red polygon on surface',
    polygon : {
        hierarchy : Cesium.Cartesian3.fromDegreesArray([-115.0, 37.0,
                                                        -115.0, 32.0,
                                                        -102.0, 31.0,
                                                        -102.0, 35.0,
                                                        -102.0, 35.0]),
        material : Cesium.Color.RED
    }
});

viewer.flyTo(redPolygon);

bluePolygon的代码不起作用：

var bluePolygon = viewer.entities.add({
    name : 'Blue polygon on surface',
    polygon : {
        //hierarchy: collection.latlonalt,
        hierarchy: Cesium.Cartesian3.fromArray(collection.latlonalt),
        material : Cesium.Color.BLUE
    }
});

viewer.flyTo(bluePolygon);

如果我使用hierarchy: collection.latlonalt,，我收到以下错误：

所以我将代码更改为hierarchy: Cesium.Cartesian3.fromArray(collection.latlonalt),，其中collection.latlonalt是我的Cartesian3数组：

但没有得到任何结论。没有错误。这是我在控制台中看到的：

为了测试，我尝试将一个z位置添加到redPolygon并将.fromDegreesArray更改为.fromArray，如下所示：

var redPolygon = viewer.entities.add({
    name : 'Red polygon on surface',
    polygon : {
        hierarchy : Cesium.Cartesian3.fromArray([-115.0, 37.0, 10.0,
                                                 -115.0, 32.0, 10.0,
                                                 -102.0, 31.0, 10.0,
                                                 -102.0, 35.0, 10.0,
                                                 -102.0, 35.0, 10.0]),
        material : Cesium.Color.RED
    }
});

viewer.flyTo(redPolygon);

这也不起作用。

Answer 1

Cesium有Cartesian3.fromDegreesArray使用的辅助函数Polygon Demo，但是，现在您已经掌握了实际的Cartesian3值，因此不需要这些辅助函数。

例如，多边形演示代码如下所示：

var redPolygon = viewer.entities.add({
    name : 'Red polygon on surface',
    polygon : {
        hierarchy : Cesium.Cartesian3.fromDegreesArray([-115.0, 37.0,
                                                        -115.0, 32.0,
                                                        -107.0, 33.0,
                                                        -102.0, 31.0,
                                                        -102.0, 35.0]),
        material : Cesium.Color.RED
    }
});

在上面的代码中，fromDegreesArray在这种情况下只需要5个批次/ lan值对的列表，并将它们转换为包含Cartesian3类的5个实例的JavaScript数组。然后将此5个Cartesian3数组存储为多边形定义中hierarchy的值。如果在运行时检查该定义，您会发现原始的lon / lat值已被丢弃，由实际的Cartesian3s取代，这要归功于辅助函数。

因此，在您的代码中，您需要一个用户到目前为止点击的Cartesian3数组。这从空数组开始，您需要至少收集三次点击，将每次点击转换为Cartesian3，如上图所示，并将push值放入数组中。一旦数组累积了3次或更多次点击，您就可以将该数组作为多边形定义的hierarchy字段传递。

通过这种方式，您可以避免调用fromDegreesArray，因为您的点击处理程序正在执行更详细的工作，即每次点击收集精确的笛卡尔位置。如果在点击之间移动相机，则每次点击时都必须进行此收集。因此，“正在进行”的数组必须在点击之间存活，直到所有点击都被收集并且可以创建多边形。

编辑：这是我想要描述的代码结构的示例。我没有在这里显示实际的点击处理程序，因为您似乎已经从鼠标点击中获得了Cartesian3值。相反，我展示了三个用于创建多边形的值。

var viewer = new Cesium.Viewer('cesiumContainer');

// Create an empty array of click positions at the start.
var clickPositions = [];

// When the first mouse click is received, convert to Cartesian3, and push it into the array.
var click1 = new Cesium.Cartesian3(-2155350.2, -4622163.4, 3817393.1);
clickPositions.push(click1);

// Later, more mouse clicks are received and pushed into the array.
var click2 = new Cesium.Cartesian3(-2288079.8, -4906803.1, 3360431.4);
clickPositions.push(click2);

var click3 = new Cesium.Cartesian3(-1087466.8, -5116129.4, 3637866.9);
clickPositions.push(click3);

// Finally, draw the polygon.
var redPolygon = viewer.entities.add({
    name : 'Red polygon on surface',
    polygon : {
        hierarchy : clickPositions,
        material : Cesium.Color.RED
    }
});

注意clickPositions分配给hierarchy时没有任何反应。 Cartesian3值的数组已经是Cesium所需的形式。

铯 - 使用相机Lat-Lon-Alt位置绘制多边形

1 个答案: