GIS相关 分类

前言

最近在学习 cesiun，遇到一些基础的理论问题无法解决，于是开始学习 WebGL，打一下基础

关于 WebGL

WebGL 使得网页在支持 HTML <canvas> 标签的浏览器中，不需要使用任何插件，便可以使用基于 OpenGL ES 2.0 的 API 在 canvas 中进行 3D 渲染。WebGL 程序由 javascript 的控制代码，和在计算机的图形处理单元（GPU, Graphics Processing Unit）中执行的特效代码 (shader code，渲染代码) 组成。WebGL 元素可以和其他 HTML 元素混合，并且会和页面的其他部分或页面背景相合成。

阿琛大约 1 分钟

使用 WebGL 创建 2D 内容

目标：画出一个 2D 正方形

引入 glMatrix 库

glMatrix:执行其矩阵操作的库，通过 CDN 形式引入使用

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <title>WebGL Demo</title>
    <link rel="stylesheet" href="./webgl.css" type="text/css" />
    <script
      src="https://cdnjs.cloudflare.com/ajax/libs/gl-matrix/2.8.1/gl-matrix-min.js"
      integrity="sha512-zhHQR0/H5SEBL3Wn6yYSaTTZej12z0hVZKOv3TwCUXT1z5qeqGcXJLLrbERYRScEDDpYIJhPC1fk31gqR783iQ=="
      crossorigin="anonymous"
      defer
    ></script>
    <script src="webgl-demo.js" type="module" defer></script>
  </head>

  <body>
    <canvas id="glcanvas" width="640" height="480"></canvas>
  </body>
</html>

阿琛小于 1 分钟

使用 gdal 进行 tif 文件的裁剪

创建 gpkg


    fun createGpkgByStr(dataPath: String, geojson: String): String {
            val ctm = System.currentTimeMillis()
            val name = "temp$ctm"

            val path = dataPath + File.separator + "tmp" + File.separator + "${name}.gpkg"
            ogr.RegisterAll()

            val ds = ogr.GetDriverByName("GPKG").CreateDataSource(path)

            val sr = SpatialReference()
            sr.ImportFromEPSG(4326)
            val layer = ds.CreateLayer("temp", sr, 3)
            val feature = Feature(layer.GetLayerDefn())
            val geom = Geometry.CreateFromJson(geojson)
            geom.FlattenTo2D()
            feature.SetGeometry(geom)
            layer.CreateFeature(feature)

//            ds.FlushCache()
//            ds.SyncToDisk()
//            gdal.GDALDestroyDriverManager()
            return path
        }

阿琛小于 1 分钟

使用 gdal 进行 png 文件的影像配准

一般图片的配准

// 创建4326坐标系
      private val sp by lazy {
           val sp = SpatialReference()
           sp.ImportFromEPSG(4326)
           sp
       }

       private val basePath: String = "H:\\java\\nrs\\"

// 进行地理配准
       fun handleImg(path: String) {
           gdal.AllRegister()
           val dataset = gdal.Open(path)
           val x = dataset.rasterXSize
           val y = dataset.rasterYSize
           val list = listOf(
               GCP(115.2626, 36.832971, 0.0, 0.0),
               GCP(115.176448, 36.527851, 0.0, y.toDouble()),
               GCP(115.554089, 36.457752, x.toDouble(), y.toDouble()),
               GCP(115.641695, 36.762737, x.toDouble(), 0.0),
           )
           dataset.SetGCPs(list.toTypedArray(), sp.ExportToWkt())
           val vector = Vector<String>()
           // -srcnodata 0  去除黑边
           // -of PNG 设置输出格式
           "-r near -of PNG  -srcnodata 0 -dstalpha".split(" ").forEach { vector.add(it) }
           gdal.Warp("$basePath/test.png", listOf(dataset).toTypedArray(), WarpOptions(vector))
       }

阿琛小于 1 分钟

关于 gdal 使用的一些总结（代码）

获取 tif 的范围

fun getExtent(path: String) {
            gdal.AllRegister()
            val driver = gdal.GetDriverByName("GTiff")

            val dataset = gdal.Open(path)
            val x = dataset.rasterXSize
            val y = dataset.rasterYSize
            val transforme = dataset.GetGeoTransform()


            val west = transforme[0]
            val dx = transforme[1]
            val north = transforme[3]
            val dy = transforme[5]

            val east = west + dx * x
            val sourth = north + dy * y

            println("${west},${east},${north},${sourth} ")

//            val ds = ogr.Open(path)
//            println(layer.GetExtent())


        }

阿琛大约 2 分钟

cesium相关之创建地球

参考地址： https://cesium.com/learn/cesiumjs-learn/cesiumjs-quickstart/

1.设置资源地址

CesiumJS 需要在您的服务器上托管一些静态文件，例如 Web worker 和 SVG 图标。配置您的模块文件夹以复制以下四个目录并将它们作为静态文件

node_modules/cesium/Build/Cesium/Workers
node_modules/cesium/Build/Cesium/ThirdParty
node_modules/cesium/Build/Cesium/Assets
node_modules/cesium/Build/Cesium/Widgets

阿琛小于 1 分钟

GDAL相关地址

编译完成的版本下载：https://www.gisinternals.com/
官网：https://gdal.org/
Java 文档：https://gdal.org/api/java/index.html
Gdal For Node ：https://www.npmjs.com/package/gdal-async

阿琛小于 1 分钟

在JDK11环境下Geoserver添加字体

在原来 JDK8 下，想要在 geoserver 添加可用的 font 是将字体文件添加放到

%JAVA_HOME%/jre/lib/fonts

阿琛小于 1 分钟

互联网地图栅格切片规则

EPSG:3857 切片规则

{"currentVersion":10.61,"serviceDescription":"","mapName":"Layers","description":"","copyrightText":"","supportsDynamicLayers":true,"layers":[{"id":0,"name":"101-shijie_region","parentLayerId":-1,"defaultVisibility":true,"subLayerIds":null,"minScale":0,"maxScale":0}],"tables":[],"spatialReference":{"wkid":102100,"latestWkid":3857},"singleFusedMapCache":true,"tileInfo":{"rows":256,"cols":256,"dpi":96,"format":"PNG","compressionQuality":0,"origin":{"x":-2.0037508342787E7,"y":2.0037508342787E7},"spatialReference":{"wkid":102100,"latestWkid":3857},"lods":[
{"level":0,"resolution":156543.03392800014,"scale":5.91657527591555E8},
{"level":1,"resolution":78271.51696399994,"scale":2.95828763795777E8},
{"level":2,"resolution":39135.75848200009,"scale":1.47914381897889E8},
{"level":3,"resolution":19567.87924099992,"scale":7.3957190948944E7},
{"level":4,"resolution":9783.93962049996,"scale":3.6978595474472E7},
{"level":5,"resolution":4891.96981024998,"scale":1.8489297737236E7},
{"level":6,"resolution":2445.98490512499,"scale":9244648.868618},
{"level":7,"resolution":1222.992452562495,"scale":4622324.434309},
{"level":8,"resolution":611.4962262813797,"scale":2311162.217155},
{"level":9,"resolution":305.74811314055756,"scale":1155581.108577},
{"level":10,"resolution":152.87405657041106,"scale":577790.554289},
{"level":11,"resolution":76.43702828507324,"scale":288895.277144},
{"level":12,"resolution":38.21851414253662,"scale":144447.638572},
{"level":13,"resolution":19.10925707126831,"scale":72223.819286},
{"level":14,"resolution":9.554628535634155,"scale":36111.909643},
{"level":15,"resolution":4.77731426794937,"scale":18055.954822},
{"level":16,"resolution":2.388657133974685,"scale":9027.977411},
{"level":17,"resolution":1.1943285668550503,"scale":4513.988705},
{"level":18,"resolution":0.5971642835598172,"scale":2256.994353},
{"level":19,"resolution":0.29858214164761665,"scale":1128.497176},
{"level":20,"resolution":0.14929107082380833,"scale":564.248588},
{"level":21,"resolution":0.07464553541190416,"scale":282.124294},
{"level":22,"resolution":0.03732276770595208,"scale":141.062147},
{"level":23,"resolution":0.01866138385297604,"scale":70.5310735}]},
"initialExtent":{"xmin":1.2440891203098156E7,"ymin":3378130.323403754,"xmax":1.3200146802202465E7,"ymax":3689109.7900786763,"spatialReference":{"wkid":102100,"latestWkid":3857}},"fullExtent":{"xmin":1.2656643609424848E7,"ymin":3499666.577932451,"xmax":1.2810124132841675E7,"ymax":3680022.8146885675,"spatialReference":{"wkid":102100,"latestWkid":3857}},"minScale":5.91657527591555E8,"maxScale":70.5310735,"units":"esriMeters","supportedImageFormatTypes":"PNG32,PNG24,PNG,JPG,DIB,TIFF,EMF,PS,PDF,GIF,SVG,SVGZ,BMP","documentInfo":{"Title":"","Author":"","Comments":"","Subject":"","Category":"","AntialiasingMode":"None","TextAntialiasingMode":"Force","Keywords":""},"capabilities":"Map,Query,Data","supportedQueryFormats":"JSON, AMF, geoJSON","exportTilesAllowed":false,"supportsDatumTransformation":true,"maxRecordCount":1000,"maxImageHeight":4096,"maxImageWidth":4096,"supportedExtensions":"KmlServer"}

阿琛大约 2 分钟

Geoserver添加坐标系

在 epsg.io 确定坐标的 wkt 参数
打开 data_dir/user_projections 文件夹，找到 epsg.properties 文件

#新增一个3857坐标系，就是这样：

3857=PROJCS["WGS 84 / Pseudo-Mercator",GEOGCS["WGS 84",DATUM["WGS_1984",SPHEROID["WGS 84",6378137,298.257223563,AUTHORITY["EPSG","7030"]],AUTHORITY["EPSG","6326"]],PRIMEM["Greenwich",0,AUTHORITY["EPSG","8901"]],UNIT["degree",0.0174532925199433,AUTHORITY["EPSG","9122"]],AUTHORITY["EPSG","4326"]],PROJECTION["Mercator_1SP"],PARAMETER["central_meridian",0],PARAMETER["scale_factor",1],PARAMETER["false_easting",0],PARAMETER["false_northing",0],UNIT["metre",1,AUTHORITY["EPSG","9001"]],AXIS["X",EAST],AXIS["Y",NORTH],EXTENSION["PROJ4","+proj=merc +a=6378137 +b=6378137 +lat_ts=0.0 +lon_0=0.0 +x_0=0.0 +y_0=0 +k=1.0 +units=m +nadgrids=@null +wktext  +no_defs"],AUTHORITY["EPSG","3857"]]

阿琛小于 1 分钟