天地图打印合集

最新推荐文章于 2022-03-24 22:51:17 发布

AriaGIS

最新推荐文章于 2022-03-24 22:51:17 发布

阅读量861

点赞数

分类专栏：天地图相关 ArcGIS API for JavaScript 文章标签：天地图打印 arcgis打印 api打印 4326

本文链接：https://blog.csdn.net/weixin_44616652/article/details/107809824

版权

ArcGIS API for JavaScript 同时被 2 个专栏收录

28 篇文章 8 订阅

订阅专栏

天地图相关

1 篇文章 0 订阅

订阅专栏

1、4API打印天地图4326坐标系

<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8" />
  <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no" />
  <title>4API打印天地图4326坐标系</title>
  <style>
    html,
    body,
    #viewDiv {
      padding: 0;
      margin: 0;
      height: 100%;
      width: 100%;
    }

    #print {
      position: absolute;
      top: 10px;
      right: 10px;
      z-index: 999;
      width: 60px;
      height: 40px;
      background-color: #fff;
      text-align: center;
      line-height: 40px;
      cursor: pointer;
      border: 1px solid #ccc;
    }
  </style>

  <link rel="stylesheet" href="https://js.arcgisonline.cn/4.15/esri/css/main.css">
  <script src="https://js.arcgisonline.cn/4.15/init.js"></script>

  <script>
    require(["esri/Map",
      "esri/views/MapView",
      "esri/layers/BaseTileLayer",
      "esri/layers/support/TileInfo",
      "esri/geometry/SpatialReference",
      "esri/geometry/Extent",
      "esri/tasks/PrintTask",
      "esri/tasks/support/PrintTemplate",
      "esri/tasks/support/PrintParameters",
      "esri/config",
      "esri/request", "dojo/dom",
      "dojo/on", "dojo/domReady!"],
      function (Map, MapView, BaseTileLayer, TileInfo,
        SpatialReference, Extent, PrintTask, PrintTemplate,
        PrintParameters, esriConfig, esriRequest, dom, on) {

        var tileInfo = new TileInfo({
          "dpi": 96,
          "format": "image/png",
          "compressionQuality": 0,
          "spatialReference": new SpatialReference({
            "wkid": 4326
          }),
          "rows": 256,
          "cols": 256,
          "origin": {
            "x": -180,
            "y": 90
          },
          "lods": [
            { "level": 0, "resolution": 1.4062500000002376, "scale": 590995186.11759996 },
            { "level": 1, "resolution": 0.703125000000119, "scale": 295497593.0588 },
            { "level": 2, "resolution": 0.351562500000059, "scale": 147748796.5294 },
            { "level": 3, "resolution": 0.17578125000003, "scale": 73874398.2647 },
            { "level": 4, "resolution": 0.0878906250000148, "scale": 36937199.1323 },
            { "level": 5, "resolution": 0.0439453125000074, "scale": 18468599.566175 },
            { "level": 6, "resolution": 0.0219726562500037, "scale": 9234299.7830875 },
            { "level": 7, "resolution": 0.0109863281250019, "scale": 4617149.89154375 },
            { "level": 8, "resolution": 0.00549316406250093, "scale": 2308574.94577187 },
            { "level": 9, "resolution": 0.00274658203125046, "scale": 1154287.47288594 },
            { "level": 10, "resolution": 0.00137329101562523, "scale": 577143.736442969 },
            { "level": 11, "resolution": 0.000686645507812616, "scale": 288571.868221484 },
            { "level": 12, "resolution": 0.000343322753906308, "scale": 144285.934110742 },
            { "level": 13, "resolution": 0.000171661376953154, "scale": 72142.9670553711 },
            { "level": 14, "resolution": 8.5830688476577E-05, "scale": 36071.4835276855 },
            { "level": 15, "resolution": 4.29153442382885E-05, "scale": 18035.7417638428 },
            { "level": 16, "resolution": 2.14576721191443E-05, "scale": 9017.87088192139 },
            { "level": 17, "resolution": 1.07288360595721E-05, "scale": 4508.93544096069 },
            { "level": 18, "resolution": 5.36441802978606E-06, "scale": 2254.46772048035 },
            { "level": 19, "resolution": 2.68220901489303E-06, "scale": 1127.23386024017 },
            { "level": 20, "resolution": 1.34110450744652E-06, "scale": 563.616930120087 }
          ]
        });

        var tileExtent = new Extent(114.229839088925, 33.9389305555556, 123.400530149205, 38.90481944444446, new SpatialReference({
          'wkid': 4326
        }));
        var MyCustomTileLayer = BaseTileLayer.createSubclass({
          properties: {
            urlTemplate: null,
          },
          getTileUrl: function (level, row, col) {
            return this.urlTemplate.replace("{level}", level).replace("{col}", col).replace("{row}", row);
          },
          fetchTile: function (level, row, col, options) {
            var url = this.getTileUrl(level, row, col);
            return esriRequest(url, {
              responseType: "image",
              allowImageDataAccess: true
            })
              .then(function (response) {
                var image = response.data;
                var width = this.tileInfo.size[0];
                var height = this.tileInfo.size[0];
                var canvas = document.createElement("canvas");
                var context = canvas.getContext("2d");
                canvas.width = width;
                canvas.height = height;
                if (this.tint) {
                  context.fillStyle = this.tint.toCss();
                  context.fillRect(0, 0, width, height);
                  context.globalCompositeOperation = "difference";
                }
                context.drawImage(image, 0, 0, width, height);
                return canvas;
              }.bind(this));
          }

        });

        var mylayer = new MyCustomTileLayer({
          urlTemplate: "http://t0.tianditu.gov.cn/vec_c/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=vec&STYLE=default&TILEMATRIXSET=c&FORMAT=tiles&tk=你的tk&TileMatrix={level}&TileCol={col}&TileRow={row}",
          tileInfo: tileInfo
        });

        var map = new Map({
          spatialReference: new SpatialReference({ 'wkid': 4326 }),
          basemap: {
            baseLayers: [mylayer]
          }
        });


        var view = new MapView({
          container: "viewDiv",
          map: map,
          extent: tileExtent,
          spatialReference: new SpatialReference({ 'wkid': 4326 }),
          scale: 72142,
          center: [118.5, 35.5]
        });

        on(dom.byId("print"), "click", exportMap);
        var printUrl = "https://linux111.esrichina.com/server/rest/services/Utilities/PrintingTools/GPServer/Export%20Web%20Map%20Task";

        var printTask = new PrintTask({
          url: printUrl
        });

        var template = new PrintTemplate({
          format: "pdf",
          exportOptions: {
            dpi: 96
          },
          layout: "a4-landscape",
          layoutOptions: {
            titleText: "Warren Wilson College Trees",
            authorText: "Sam"
          }
        });

        var params = new PrintParameters({
          view: view,
          template: template
        });

        function exportMap() {
          printTask.execute(params).then(printResult, printError);
        }
        function printResult(value) {
          window.open(value.url);
        };
        function printError(value) {
          alert(value.message)
        };
      });
  </script>
</head>

<body>
  <div id="viewDiv">
    <div id="print">print</div>
  </div>
</body>

</html>

AriaGIS

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
天地图打印合集

1、4API打印天地图4326坐标系<!DOCTYPE html><html><head> <meta charset="utf-8" /> <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no" /> <title>4API打印天地图4326坐标系</title> <style&g
复制链接

扫一扫