cesium学习记录03-QGis数据生产=＞Postgis存储=＞Geoserver发布=＞Cesium调用

news2024/9/20 8:48:14

说明：

参照文章

1，安装 QGIS

下载安装
（前四步就可以了）

2，下载安装postgresql

3，下载安装PostGis

4，QGIS连接PostGis

在这里插入图片描述

5，QGIS 上传到Postgis

1，QGIS图的图

（1）双击在上面新建的【高德影像】，然后再双击【高德道路】，将其添到图层在这里插入图片描述
（2）在QGIS的工具栏中，找到【新建临时图层】

（3）在弹出的窗口中，【几何图形类型】设置为：多边形，点【OK】

（4）在工具栏中找到【添加多边形要素】

（5）在地图中使用左键点击您要的范围，并使用右键完成作画。
在这里插入图片描述
（6）数据保存到PostGIS中
（7）移除这个临时图层
（8）双击PostGIS刚加进来的临时图层

2，geojson数据

（1）打开数据源管理器，双击要添加进来的geojson数据
在这里插入图片描述
（2）发现数据已经在图层中显示

（3）同上面的（6）、（7）、（8）步

6. 使用Geoserver发布Postgis数据

（1）复制这两个文件
在这里插入图片描述
放到下面的文件夹中

（2）运行geoserver
（默认用户名：admin，密码：geoserver）

（3）添加工作区

（4）新建数据源

（5）添加图层

找到刚刚在QGIS上编辑的数据，点击发布
下面红框中的两个地方都点一下
在这里插入图片描述

（6）图层预览

点击【OpenLayers】

geoserver发布成功

7，cesium调用geoserver发布的内容

（1）跨域处理（在geoserver中配置跨域也可以）
在 proxyTable中
添加

 "/cesiumServer": {
              target: "http://localhost:8080",
              secure: true,
              changeOrigin: true,
              pathRewrite: {
                  // 路径重写，
                  "^/cesiumServer": "" // 替换target中的请求地址
              }
          },

（2）调用
url:
在这里插入图片描述
layers:
代码：

let viewer = this.viewer;
    let _this = this;
    const wmsImageryProvider = new Cesium.WebMapServiceImageryProvider({
      url: "/cesiumServer/geoserver/test_work/wms",
      layers: "	test_work:test_layer2",
      parameters: {
        transparent: true, //务必设为true。否则不显示底图
        format: "image/png",
        srs: "EPSG:4326",
      },
    });
    viewer.imageryLayers.addImageryProvider(wmsImageryProvider);