zoukankan      html  css  js  c++  java
  • Arcgis api for javascript学习笔记(3.2X版本)-Map图层叠加以及基本操作

    1. 不设置默认底图,第一个图层作为底图,然后叠加另外一个图层

    先添加图层1,第一个图层1作为默认底图,然后在图层1上叠加图层2,并设置图层2的透明度为50%。

     1 <!DOCTYPE html>
     2 <html>
     3 <head>
     4     <title>simple demo</title>
     5     <link rel="stylesheet" href="http://localhost:8003/arcgis_js_v320_api/library/3.20/3.20/esri/css/esri.css">
     6     <style type="text/css">
     7         html, body { margin: 0; padding: 0; height: 100%; width: 100%; }
     8         #viewDiv { width: 100%; height: 100%; }
     9     </style>
    10 </head>
    11 <body>
    12     <div id="viewDiv"></div>
    13     <script src="http://localhost:8003/arcgis_js_v320_api/library/3.20/3.20/init.js"></script>
    14     <script type="text/javascript">
    15         require([
    16             "esri/map",
    17             "esri/layers/ArcGISTiledMapServiceLayer",
    18             "dojo/domReady!"],
    19             function (Map, ArcGISTiledMapServiceLayer) {
    20                 var map = new Map("viewDiv");
    21                 var tms1 = new ArcGISTiledMapServiceLayer("http://cache1.arcgisonline.cn/arcgis/rest/services/ChinaOnlineCommunity/MapServer"); //图层1
    22                 map.addLayer(tms1);
    23                 var tms2 = new ArcGISTiledMapServiceLayer("http://services.arcgisonline.com/arcgis/rest/services/Demographics/USA_Projected_Population_Change/MapServer", { "opacity": 0.5 }); //图层2,透明度50%
    24                 map.addLayer(tms2);
    25             }
    26         );
    27     </script>
    28 </body>
    29 </html>

    效果如下:

     

  • 相关阅读:
    这是个神奇的博客
    Tomcat Access Log 的格式
    CA证书
    记一次性能调优
    web系统能力培养计划
    金融知识学习
    读《华为区块链白皮书》
    马未都说收藏:陶瓷篇(8、9)元青花、永宣青花
    阿里历年面试试题
    回车(CR)换行(LF)的来历及区别
  • 原文地址:https://www.cnblogs.com/tracine0513/p/7795464.html
Copyright © 2011-2022 走看看