初识cesium----加载不同JSON格式例子

Posted 2020-09-06 lilyxs

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了初识cesium----加载不同JSON格式例子相关的知识，希望对你有一定的参考价值。

最近研究了几天cesium.js，有些入门级的收获，随手记录下来，方便以后来查阅！

cesium支持topojson,GEOjson和普通的json格式，下面展示三种不同的格式的例子

一、topojson

<body>
    <div id="cesiumContainer"></div>
    <script>
    //加载topojson
    var viewer = new Cesium.Viewer(\'cesiumContainer\');
    var promise= viewer.dataSources.add(Cesium.GeoJsonDataSource.load(\'../../Apps/china.topojson\', {
    stroke: Cesium.Color.BLACK,
    fill: Cesium.Color.RED,
    strokeWidth: 3,
    markerSymbol: \'?\'
    }));
    viewer.flyTo(promise);
    </script>
</body>

二、GEOjson

<body>
    <div id="cesiumContainer"></div>
    <script>
    var viewer = new Cesium.Viewer(\'cesiumContainer\');
 //Seed the random number generator for repeatable results.
    Cesium.Math.setRandomNumberSeed(0);
    var promise=Cesium.GeoJsonDataSource.load(\'../../Apps/testone.json\');
    promise.then(function(dataSource) {
        viewer.dataSources.add(dataSource);
        var entities = dataSource.entities.values;
        var colorHash = {};
        for (var i = 0; i < entities.length; i++) {
            var entity = entities[i];
            var name = entity.name;
            var color = colorHash[name];
            if (!color) {
                color = Cesium.Color.fromRandom({
                    alpha : 1.0
                });
                colorHash[name] = color;
            }
            entity.polygon.material = color;
            entity.polygon.outline = false;            
            entity.polygon.extrudedHeight =5000.0;
            }
        });
        viewer.flyTo(promise);
    </script>
</body>

三、普通json

<body>
  <div id="cesiumContainer"></div>
  <script>
    var viewer = new Cesium.Viewer(\'cesiumContainer\');
    Cesium.Math.setRandomNumberSeed(0);
    Cesium.loadJson(\'/../Apps/Points.json\').then(function(jsonData) {
      for (var i =0 ;i<=jsonData.features.length-10; i++) {
              var ifeature=jsonData.features[i]; 
         for (var k = 0;k<ifeature.geometry.paths[0].length-10; k++) {
               if (ifeature.geometry.paths[0][k].length==2) {
                    viewer.entities.add({
                    position : Cesium.Cartesian3.fromDegrees(ifeature.geometry.paths[0][k][0],ifeature.geometry.paths[0][k][1]),
                    point : {
                        pixelSize : 10,
                        color :Cesium.Color.YELLOW
                     }
               });
             }           
           }
      }           
   }).otherwise(function(error) {
});
 </script>
</body>

普通json转GEOjson参考http://blog.csdn.net/liyan_gis/article/details/50540842

以上是关于初识cesium----加载不同JSON格式例子的主要内容，如果未能解决你的问题，请参考以下文章

Cesium的model初识

Cesium（四）加载影像图层

Cesium加载tomcat发布的json显示跨域问题

cesium 加载shp格式的白模建筑