描述
本例使用唯一值渲染器来作为美国的符号。每个州有一个字符串属性"SUB_REGION"表示它的国家的地区。UniqueValueRenderer.addValue()方法被用来重复地为每个区域定义一个颜色。
1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 2 <html> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> 5 <meta http-equiv="X-UA-Compatible" content="IE=7" /> 6 <title>Unique Value Renderer</title> 7 <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/1.5/js/dojo/dijit/themes/tundra/tundra.css"> 8 <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=1.5"></script> 9 <script type="text/javascript" charset="utf-8"> 10 dojo.require("esri.map"); 11 dojo.require("esri.tasks.query"); 12 13 var map; 14 15 function init() { 16 map = new esri.Map("map", { 17 extent: new esri.geometry.Extent({xmin:-130.78125,ymin:19.51171875,xmax:-60.46875,ymax:54.66796875,spatialReference:{wkid:4326}}), 18 slider: false 19 }); 20 dojo.connect(map, "onLoad", connectErrorHandler); 21 dojo.connect(map, "onLoad", doQuery); 22 map.addLayer(new esri.layers.ArcGISTiledMapServiceLayer("http://server.arcgisonline.com/ArcGIS/rest/services/ESRI_StreetMap_World_2D/MapServer")); 23 } 24 25 dojo.addOnLoad(init); 26 27 function connectErrorHandler() { 28 dojo.connect(map.graphics, "onError", errorHandler); 29 } 30 31 function errorHandler(err) { 32 console.error(err.message); 33 } 34 35 function doQuery() { 36 var queryTask = new esri.tasks.QueryTask("http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Specialty/ESRI_StateCityHighway_USA/MapServer/1"); 37 var query = new esri.tasks.Query(); 38 query.where = "1=1"; 39 query.outFields = ["SUB_REGION"]; 40 query.returnGeometry = true; 41 queryTask.execute(query, addFeatureSetToMap); 42 } 43 44 function addFeatureSetToMap(featureSet) { 45 //define default symbol for features 46 var defaultSymbol = new esri.symbol.SimpleFillSymbol().setStyle(esri.symbol.SimpleFillSymbol.STYLE_NULL); 47 defaultSymbol.outline.setStyle(esri.symbol.SimpleLineSymbol.STYLE_NULL); 48 49 //create renderer 50 var renderer = new esri.renderer.UniqueValueRenderer(defaultSymbol, "SUB_REGION"); 51 52 //add symbol for each possible value 53 renderer.addValue("Pacific", new esri.symbol.SimpleFillSymbol().setColor(new dojo.Color([255,0,0,0.5]))); 54 renderer.addValue("Mtn", new esri.symbol.SimpleFillSymbol().setColor(new dojo.Color([0,255,0,0.5]))); 55 renderer.addValue("N Eng", new esri.symbol.SimpleFillSymbol().setColor(new dojo.Color([0,0,255,0.5]))); 56 renderer.addValue("S Atl", new esri.symbol.SimpleFillSymbol().setColor(new dojo.Color([255,0,255,0.5]))); 57 renderer.addValue("Mid Atl", new esri.symbol.SimpleFillSymbol().setColor(new dojo.Color([255,255,255,0.75]))); 58 renderer.addValue("E N Cen", new esri.symbol.SimpleFillSymbol().setColor(new dojo.Color([0,255,255,0.5]))); 59 renderer.addValue("W N Cen", new esri.symbol.SimpleFillSymbol().setColor(new dojo.Color([255,255,0,0.5]))); 60 renderer.addValue("E S Cen", new esri.symbol.SimpleFillSymbol().setColor(new dojo.Color([127,127,127,0.5]))); 61 renderer.addValue("W S Cen", new esri.symbol.SimpleFillSymbol().setColor(new dojo.Color([0,0,0,0.5]))); 62 map.graphics.setRenderer(renderer); 63 64 dojo.forEach(featureSet.features, function(feature) { 65 map.graphics.add(feature); 66 }); 67 } 68 69 </script> 70 71 </head> 72 <body> 73 <div id="map" class="tundra" style="800px; height:400px; border:1px solid #000;"></div> 74 </body> 75 </html>