arcgis server javascript api 唯一值渲染-白红宇

arcgis server javascript api 唯一值渲染

阅读量：5334 次

发布时间：2019-06-15

本文共 3332 字，大约阅读时间需要 11 分钟。

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"

   "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=7" />
    <title>Unique Value Renderer</title>
    <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/1.5/js/dojo/dijit/themes/tundra/tundra.css">
            <script type="text/javascript">var djConfig = {parseOnLoad: true }</script>
    <script type="text/javascript" src= "http://serverapi.arcgisonline.com/jsapi/arcgis/?v=1.5"></script>
    <script type="text/javascript" charset="utf-8">
      dojo.require("esri.map");
      dojo.require("esri.tasks.query");
      var map;
      function init() { 
     
        map = new esri.Map("map", { 
     
          extent: new esri.geometry.Extent({xmin:-130.78125,ymin:19.51171875,xmax:-60.46875,ymax:54.66796875,spatialReference:{wkid:4326}}),
          slider: false
        });
        dojo.connect(map, "onLoad", connectErrorHandler);
        dojo.connect(map, "onLoad", doQuery);
        map.addLayer(new esri.layers.ArcGISTiledMapServiceLayer("http://server.arcgisonline.com/ArcGIS/rest/services/ESRI_StreetMap_World_2D/MapServer"));
      }
      dojo.addOnLoad(init);
      function connectErrorHandler() { 
     
        dojo.connect(map.graphics, "onError", errorHandler);
      }
      function errorHandler(err) { 
     
        console.error(err.message);
      }
      function doQuery() { 
     
        var queryTask = new esri.tasks.QueryTask("http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Specialty/ESRI_StateCityHighway_USA/MapServer/1");
        var query = new esri.tasks.Query();
        query.where = "1=1";
        query.outFields = ["SUB_REGION"];
        query.returnGeometry = true;
        queryTask.execute(query, addFeatureSetToMap);
      }
      function addFeatureSetToMap(featureSet) { 
     
        //define default symbol for features
        var defaultSymbol = new esri.symbol.SimpleFillSymbol().setStyle(esri.symbol.SimpleFillSymbol.STYLE_NULL);
        defaultSymbol.outline.setStyle(esri.symbol.SimpleLineSymbol.STYLE_NULL);
        //create renderer
        var renderer = new esri.renderer.UniqueValueRenderer(defaultSymbol, "SUB_REGION");
        //add symbol for each possible value
        renderer.addValue("Pacific", new esri.symbol.SimpleFillSymbol().setColor(new dojo.Color([255,0,0,0.5])));
        renderer.addValue("Mtn", new esri.symbol.SimpleFillSymbol().setColor(new dojo.Color([0,255,0,0.5])));
        renderer.addValue("N Eng", new esri.symbol.SimpleFillSymbol().setColor(new dojo.Color([0,0,255,0.5])));
        renderer.addValue("S Atl", new esri.symbol.SimpleFillSymbol().setColor(new dojo.Color([255,0,255,0.5])));
        renderer.addValue("Mid Atl", new esri.symbol.SimpleFillSymbol().setColor(new dojo.Color([255,255,255,0.75])));
        renderer.addValue("E N Cen", new esri.symbol.SimpleFillSymbol().setColor(new dojo.Color([0,255,255,0.5])));
        renderer.addValue("W N Cen", new esri.symbol.SimpleFillSymbol().setColor(new dojo.Color([255,255,0,0.5])));
        renderer.addValue("E S Cen", new esri.symbol.SimpleFillSymbol().setColor(new dojo.Color([127,127,127,0.5])));
        renderer.addValue("W S Cen", new esri.symbol.SimpleFillSymbol().setColor(new dojo.Color([0,0,0,0.5])));
        map.graphics.setRenderer(renderer);
        dojo.forEach(featureSet.features, function(feature) { 
     
          map.graphics.add(feature);
        });
      }
    </script>
  </head>
  <body>
    <div id="map" class="tundra" style="width:800px; height:400px; border:1px solid #000;"></div>
  </body>
</html>