zoukankan      html  css  js  c++  java
  • Cesium之3D拉伸显示行政区

    转自原文 Cesium之3D拉伸显示行政区含GeoJSON数据生成过程GDAL的ogr2ogr

    Cesiumjs 是一套javascript库,用来渲染3D地球,2D区域地图,和多种GIS要素。不需要安装任何插件就能在支持最新HTML5标准的浏览器上运行。支持WebGL硬件加速,非常适合动态数据在GIS图层上的展示,是一个跨平台,开源,非常有前途的webgis表现层库。Cesium 基于 Apache 开源协议,支持商业和非商业免费使用。

    背景:

    Cesiumjs源自 Analytical Graphics, Inc. (AGI)公司为他们客户开发一个虚拟地球项目,后来将cesium项目贡献给开源社区并一直活跃开发中。是一种针对Cesium-应用的流式高分辨率服务器)另一个公司级的贡献者是NICTA (NationalICT Australia) 澳大利亚最大的信息与通讯技术中心,NICTA的员工们贡献了瓦片地图服务、地形处理等cesium的核心功能。并一直使用cesium开发环境监测分析、交通基础设施建模仿真优化等领域的应用。

    Demo需求,想要将北京市行政区划内的要素,用3D表现出来,首先,需要得到北京16个区的面坐标:

    Cesium通过GeoJSON(JSON格式)格式的数据展示空间要素,因此,需要得到此种格式的北京行政区划坐标,通过研究,可以使用GDAL的ogr2ogr方法将shp格式的图层转成GeoJSON格式

    下面说一下GDAL的下载和使用:

    需要安装GDAL,下载路径:http://www.gisinternals.com/release.php
    下载的是第一个:release-1500-gdal-1-11-3-mapserver-6-4-2
    解压缩release-1500-gdal-1-11-3-mapserver-6-4-2.zip
    根据里面的read-me.txt,安装此GDAL需要CMD运行SDKShell.bat命令即可,成功安装,每次重启机器后,需要重新执行此程序进行安装,才能使用
    然后cd C:UsersIBM_ADMINDownloads elease-1500-gdal-1-11-3-mapserver-6-4-2ingdalapps

    根据ogr2ogr.exe的工具进行转换,开始,找到的shp文件转换失败,后从此命令转换的shp修改了下,即可成功转成json,可能是有的shp文件不支持,具体不详
    命令:
    将geoJSON转成shp格式:
    C:UsersIBM_ADMINDownloads elease-1500-gdal-1-11-3-mapserver-6-4-2ingdala
    pps>ogr2ogr -f "ESRI Shapefile" v.shp geojsonfile.json

    将f.shp转成geoJSON格式:
    C:UsersIBM_ADMINDownloads elease-1500-gdal-1-11-3-mapserver-6-4-2ingdala
    pps>ogr2ogr -f "GeoJSON" o.json f.shp

    因为本地没有现成的北京行政区shp图层,因此,又发现竟然可以通过ESRI在线地图服务的行政区图层转成GeoJSON格式,开始发现坐标系不是wgs84,Cesium-1.16仅支持WGS84坐标系,因为,加入参数(此处指的是坐标转换参数,具体的可以通过ArcGIS的spatial Adjust 获取的校正参数,或者,直接是坐标平移参数。20.3.21 更新),将ESRI的输出坐标系转成4326即可。


    代码:

    ogr2ogr -f GeoJSON test.json "http://cache1.arcgisonline.cn/ArcGIS/rest/services/ChinaCities_Community_BaseMap_CHN/BeiJing_Community_BaseMap_CHN/MapServer/0/query?where=1%3D1&outfields=*&f=json" OGRGeoJSON
    修改下语句即可,ArcGISServer支持输出不同的坐标系
    ogr2ogr -f GeoJSON test.json "http://cache1.arcgisonline.cn/ArcGIS/rest/services/ChinaCities_Community_BaseMap_CHN/BeiJing_Community_BaseMap_CHN/MapServer/0/query?where=1%3D1&outSR=4326&outfields=*&f=json" OGRGeoJSON

    完成导出

    这时候终于得到了GeoJSON格式的北京行政区数据文件

    下面就是将Cesium现成的例子,改个数据源地址,和高程字段

    //Seed the random number generator for repeatable results.
        Cesium.Math.setRandomNumberSeed(0);
    
        var promise = Cesium.GeoJsonDataSource.load('../../SampleData/test.json');
        promise.then(function(dataSource) {
            viewer.dataSources.add(dataSource);
    
            //Get the array of entities
            var entities = dataSource.entities.values;
            
            var colorHash = {};
            for (var i = 0; i < entities.length; i++) {
                //For each entity, create a random color based on the state name.
                //Some states have multiple entities, so we store the color in a
                //hash so that we use the same color for the entire state.
                var entity = entities[i];
                var name = entity.name;
                var color = colorHash[name];
                if (!color) {
                    color = Cesium.Color.fromRandom({
                        alpha : 1.0
                    });
                    colorHash[name] = color;
                }
                
                //Set the polygon material to our random color.
                entity.polygon.material = color;
                //Remove the outlines.
                entity.polygon.outline = false;
    
                //Extrude the polygon based on the state's population.  Each entity
                //stores the properties for the GeoJSON feature it was created from
                //Since the population is a huge number, we divide by 50.
                entity.polygon.extrudedHeight = entity.properties.Shape_Area / 100000.0;
             
                }
            }
            viewer.zoomTo(promise);
    

     

    最终效果如上图所示。

  • 相关阅读:
    Python爬虫-05:Ajax加载的动态页面内容
    Python爬虫-04:贴吧爬虫以及GET和POST的区别
    Python-爬虫03:urllib.request模块的使用
    Python Numpy-基础教程
    8皇后算法
    迷宫算法
    归并排序
    查找算法
    排序算法
    设计模式
  • 原文地址:https://www.cnblogs.com/arxive/p/8414884.html
Copyright © 2011-2022 走看看