Question

我想在Cesium中可视化一些3d数据点，但不想设置服务器。我下载了Cesium-1.34.zip并将其解压缩到我的桌面。然后，我创建了一个.html文件，该文件也位于我的桌面上，并从Cesium-1.34解压缩文件夹中提取资源。我在http://cesiumjs.org/Cesium/Apps/Sandcastle/index.html?src=PolylineVolume.html&label=Geometries中添加了一些示例代码来测试它。我的全部代码如下：

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1,
        maximum-scale=1, minimum-scale=1, user-scalable=no">
  <title>Hello World!</title>
  <script src="Cesium-1.34/Build/Cesium/Cesium.js"></script>
  <style>
      @import url(Cesium-1.34/Apps/Sandcastle/templates/bucket.css);
      @import url(Cesium-1.34/Build/Cesium/Widgets/widgets.css);
      html, body, #cesiumContainer {
          width: 100%; height: 100%; margin: 0; padding: 0; overflow: hidden;
      }
  </style>
</head>
<body>

<div class="fullSize" id="cesiumContainer"></div>
<div id="loadingOverlay"><h1>Loading...</h1></div>
<div id="toolbar"></div>

  <script>



    var viewer = new Cesium.Viewer('cesiumContainer', {
        baseLayerPicker: false,
        imageryProvider: new Cesium.BingMapsImageryProvider({
                    url : 'http://dev.virtualearth.net',
            key : 'al3lvBftgu3T17GnraSB~sDScxf9wA4dopWEvK2swfA~AlwqHWs4LzhiC2oOHAFYe9dZMVQtYCQHRGyC8Y6Hyq9-109ibBI9suhwFj0RoRAp'
                })
    });

var greenBox1 = viewer.entities.add({
    name : 'Green box with beveled corners and outline',
    polylineVolume : {
        positions : Cesium.Cartesian3.fromDegreesArrayHeights([-90.0, 32.0, 0.0,
                                                               -90.0, 36.0, 100000.0,
                                                               -94.0, 36.0, 0.0]),
        shape :[new Cesium.Cartesian2(-50000, -50000),
                new Cesium.Cartesian2(50000, -50000),
                new Cesium.Cartesian2(50000, 50000),
                new Cesium.Cartesian2(-50000, 50000)],
        cornerType : Cesium.CornerType.BEVELED,
        material : Cesium.Color.GREEN.withAlpha(0.5),
        outline : true,
        outlineColor : Cesium.Color.BLACK
    }
});

viewer.zoomTo(viewer.entities);

  </script>
</body>
</html>

问题是应该出现在地球上的绿色框不存在。我没有从Developer Tools窗口中收到任何错误。我确实收到了一些警告和消息：

警告：DOM7011：此页面上的代码禁用了后退和转发缓存。
消息：HTML1300：导航已发生。
消息：WEBGL11258：暂时切换到软件渲染以显示WebGL内容。此应用程序使用Cesium的默认Bing Maps密钥。请尽快为应用程序创建一个新密钥......

关于密钥的消息很奇怪，因为我肯定在代码中使用我自己的密钥，但我认为这不会干扰实体根本没有出现任何错误。在这一点上我很难过，我想如果一个实体无法显示会出现错误，但我什么都没得到。这可能是因为它确实需要在服务器上运行。关于我缺少什么或如何使用本地配置在CesiumJS上绘制实体的任何提示？

Answer 1

Bing键错误消息仍然显示，因为您的查看器上显示了Geocoder小部件（默认情况下），Geocoder使用Bing API进行地理编码。您可以在构建Cesium.Viewer之前通过指定前面的键来修复它，如下所示：

Cesium.BingMapsApi.defaultKey = 'your_key_here';

var viewer = new Cesium.Viewer('cesiumContainer', {
    baseLayerPicker: false,
    imageryProvider: new Cesium.BingMapsImageryProvider({
        url : 'http://dev.virtualearth.net'
    })
});

此外，不支持直接从file://协议运行Cesium，因为Cesium在很大程度上依赖于纹理，Web工作者脚本，JSON文件等资源。典型的浏览器可防止文件中的JavaScript访问其他文件。因此，Cesium附带了一个小server.js文件，您可以使用NodeJS运行该文件，以便在本地运行一个小型开发服务器来托管Cesium的副本。有关详细信息，请参阅Cesium Up and Running。

遵循此建议后，＆＃34;绿色框＆＃34;原始问题的代码运行得很好。

没有出现在CesiumJS中的实体

1 个答案: