Cesium中对geojson的处理

最新推荐文章于 2025-05-19 20:06:44 发布

原创

最新推荐文章于 2025-05-19 20:06:44 发布 · 8.5k 阅读

23 ·

CC 4.0 BY-SA版权

文章标签：

#WebGL #Cesium #geoJson

最近关注到cesium对json处理，有点小收获，记录下来，有不对的请指正。

Cesium读取geojson

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;