• arcgis js api 4.x加载geoserver发布的地方坐标系(自定义坐标系)的wms服务


    问题描述:之前研究过arcgis js api 4.x加载arcgis server 发布的地方坐标系的wms服务,后来研究出来能正常加载了,想了解的可以看我之前的博客。但是一直困于加载geoserver发布的地方坐标系的wms服务,一直都是用的WMSLayer这个调用,一直报坐标系不兼容的错误。

    1.地方坐标系不是标准的坐标系,没有对应的EPSG编码,是为了加密对标准坐标进行偏移等操作形成的新的坐标系。

    2.在geoserver发布服务的时候,不占用现有的EPSG编码,需要在epsg.properties文件中追加一条地方坐标系的geoserver格式的wkt,可以参照类似格式将自己的坐标系wkt串调整。追加完需要重启geoserver服务3.geoserver发布服务的时候选择坐标系选择 刚加的epsg:0;如果选择的数据的srid与0不一样需要将数据的srid改变或转换下,如原来的数据的srid是4547,我可以通过这种select语句方式改变srid为0 ,如果不改变,预览wms服务时会报srid不一致的错误! 

    select objectid,ST_GeomFromText(ST_AsText(geom), 0) geom,safegrade from gis

    4.发布完wms服务,能正常预览后,需要用arcgis js api 4.x写代码了,这是重点!

    构造一个CustomWMSLayer类,然后进行实例化传参,最后map加载gisLayer即可。大功告成!!!

    1. const CustomWMSLayer = BaseDynamicLayer.createSubclass({
    2. properties: {
    3. mapUrl: null,
    4. mapParameters: null
    5. },
    6. getImageUrl: function (extent, width, height) {
    7. const urlVariables = this._prepareQuery(
    8. this.mapParameters,
    9. extent,
    10. width,
    11. height
    12. );
    13. const queryString = this._joinUrlVariables(urlVariables);
    14. return this.mapUrl + "?" + queryString;
    15. },
    16. _prepareQuery: function (queryParameters, extent, width, height) {
    17. const wkid = extent.spatialReference.isWebMercator
    18. ? 3857
    19. : extent.spatialReference.wkid;
    20. const replacers = {
    21. width: width,
    22. height: height,
    23. wkid: wkid,
    24. xmin: extent.xmin,
    25. xmax: extent.xmax,
    26. ymin: extent.ymin,
    27. ymax: extent.ymax
    28. };
    29. const urlVariables = this._replace({}, queryParameters, replacers);
    30. return urlVariables;
    31. },
    32. _replace: (urlVariables, queryParameters, replacers) => {
    33. Object.keys(queryParameters).forEach((key) => {
    34. urlVariables[key] = Object.keys(replacers).reduce(
    35. (previous, replacerKey) => {
    36. return previous.replace(
    37. "{" + replacerKey + "}",
    38. replacers[replacerKey]
    39. );
    40. },
    41. queryParameters[key]
    42. );
    43. });
    44. return urlVariables;
    45. },
    46. _joinUrlVariables: (urlVariables) => {
    47. return Object.keys(urlVariables).reduce((previous, key) => {
    48. return (
    49. previous + (previous ? "&" : "") + key + "=" + urlVariables[key]
    50. );
    51. }, "");
    52. }
    53. });
    54. const gisLayer = new CustomWMSLayer({
    55. mapUrl: "http://localhost:9000/geoserver/topp/wms",
    56. mapParameters: {
    57. SERVICE: "WMS",
    58. REQUEST: "GetMap",
    59. FORMAT: "image/png",
    60. TRANSPARENT: "TRUE",
    61. STYLES: "",
    62. VERSION: "1.3.0",
    63. LAYERS: "topp:gis",
    64. WIDTH: "{width}",
    65. HEIGHT: "{height}",
    66. CRS: "EPSG:0",
    67. BBOX: "{xmin},{ymin},{xmax},{ymax}"
    68. },
    69. });

    参考文档为arcgis js api官方文档Sandbox | Sample Code | ArcGIS Maps SDK for JavaScript 4.27 | ArcGIS Developers

  • 相关阅读:
    01-Scala环境部署
    golang Context应用举例
    Day 46 Redis缓存集群
    自动化测试 | selenium自动化测试框架,优化提高selenium的执行速度......
    《安富莱嵌入式周报》第291期:分分钟设计数字芯片,单片机版JS,神经网络DSP,microPLC,FatFS升级至V0.15,微软Arm64 VS正式版发布
    封装系统之新手操作版
    练习八-利用有限状态机进行时序逻辑的设计
    Android 7.1 音量定制限定在0-80%之间可调节
    【笔者感悟】笔者的学习感悟【五】
    蓝桥杯软件赛Java研究生组/A组)第二章基础算法-第三节:倍增
  • 原文地址:https://blog.csdn.net/xlp789/article/details/133971028