最近研究了几天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