Cesium是一个开源的Web地球项目,希望有一天能把他做到Google Earth那样的程度。
刚开始嘛,一般就是加载一个普通的地球。
首先引入他的JS,然后script中加点点代码。web端的地图或地球,一般都采用了div、canvas来实现,然后引用的js会自动关联到ID属性,所以基础代码如下:
如下代码加载了kml数据
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no"> <title>KML</title> <link href="../Build/Cesium/Widgets/widgets.css" rel="stylesheet"> <script src="../Build/Cesium/Cesium.js"></script> <style> html, body, #cesiumContainer { width: 100%; height: 100%; margin: 0; padding: 0; overflow: hidden; } </style> </head> <body> <div id="cesiumContainer"></div> <script> var viewer = new Cesium.Viewer('cesiumContainer');//初始化地球
//加载数据 viewer.dataSources.add(Cesium.KmlDataSource.load('../KMZ KML/polygon1.kml')).then(function(dataSource){ viewer.clock.shouldAnimate = false; var rider = dataSource.entities.getById('tour');
//缩放到数据所在地方 viewer.flyTo(rider).then(function(){ viewer.trackedEntity = rider; viewer.selectedEntity = viewer.trackedEntity; viewer.clock.multiplier = 30; viewer.clock.shouldAnimate = true; }); }); </script> </body> </html>