CesiumJS:如何拉伸“ LineString” GeoJSON数据?

时间:2019-01-24 08:02:50

标签: javascript json geojson cesium

我刚刚开始探索CesiumJS,我想扩展我的GeoJSON建筑数据。

到目前为止,据我了解,extrudeHeight似乎仅对多边形有效。但是,我的数据是“ LineString”格式的。

下面的附加代码显示了到目前为止我已经尝试过的内容。我可以知道我在做什么错吗?非常感谢我能获得的任何帮助!

Scanner br = new Scanner(System.in);
int a = br.nextInt();
int b = br.nextInt();
int c = br.nextInt();

GeoJSON:

dataSource1.loadUrl('data/buildings.json').then(function(loadedDatasource) {
            viewer.dataSources.add(loadedDatasource);
            var entities = loadedDatasource.entities.entities;
            var colorHash = {};
            for (var i = 0; i < 1; i++) {
                var entity = entities[i];
                entity.polyline = new Cesium.ColorMaterialProperty.fromColor(new Cesium.Color(1.0, 1.0, 1.0, 0));
                entity.polyline.outlineColor = new Cesium.ConstantProperty(new Cesium.Color(1, 1, 1, 0.48));
                entity.polyline.outlineWidth = new Cesium.ConstantProperty(0.5);
                entity.polyline.outline = true;
                entity.polyline.extrudedHeight = new Cesium.ConstantProperty(entity.properties.buildingLevels * 5.0);
                entity.building = true;
            }
        }

2 个答案:

答案 0 :(得分:0)

您可以使用turf.js

将LineString转换为多边形。
var line = {
  "type": "Feature",
  "geometry": {
    "type": "LineString",
    "coordinates": [ [ 0,0 ], [ 0,1 ], [ 1,1 ], [ 1,0 ] ]
  }
};

var polygon = turf.lineToPolygon(line);

或手动执行,因为geojson是非常简单的格式:

var crd = line.geometry.coordinates;
var last = c.length - 1; 
if (crd[0][0] !== crd[last][0] || crd[0][1] !== crd[last][1]) {
    crd.push(crd[0]);
}
line.geometry.type = 'Polygon';
line.geometry.coordinates = [crd];

答案 1 :(得分:0)

我认为您应该使用Cesium Corridor,如下所示:

var json = {"type":"Feature","geometry":{"type":"LineString","coordinates":[[103.8518324,1.2843096],[103.8522078,1.284276],[103.8522253,1.2842654],[103.8522361,1.2842455],[103.8522209,1.2840604],[103.8521175,1.2840652],[103.8521138,1.2840226],[103.8518128,1.2840482],[103.851781,1.2840535],[103.8517572,1.2840662],[103.8517338,1.2840891],[103.8517138,1.2841128],[103.8517016,1.2841443],[103.851698,1.2841847],[103.8517047,1.2842194],[103.8517208,1.2842492],[103.8517546,1.2842777],[103.851795,1.2842959],[103.8518285,1.2842935],[103.8518324,1.2843096]]},"properties":{"name":"Chevron House","height":"151","building":"yes","old_name":"Caltex House","wikidata":"Q2934405","addr:city":"Singapore","min_height":"16","addr:street":"Raffles Place","roof:colour":"#f9fdfe","addr:country":"SG","addr:postcode":"039803","building:colour":"#f9fdfe","buildingLevels":"33","addr:housenumber":"30","building:min_level":"3"}};


var Corridor = viewer.entities.add({
        corridor : {
        positions : Cesium.Cartesian3.fromDegreesArray(json.geometry.coordinates.flat()),
        height : 100.0,
        extrudedHeight : json.properties.buildingLevels * 5.0,
        width : 1.0,
        cornerType: Cesium.CornerType.BEVELED,
        material : Cesium.Color.BLUE.withAlpha(0.5),
        outline : true, // height or extrudedHeight must be set for outlines to display
        outlineColor : Cesium.Color.WHITE
    }
});

Working example

相关问题