Turn on suggestions
Auto-suggest helps you quickly narrow down your search results by suggesting possible matches as you type.
Cancel
- Home
- :
- About MarkCunningham1
MarkCunningham1
New Contributor III
since
07-04-2014
11-11-2020
17
Posts created
3
Kudos given
1
Solutions
2
Kudos received
Turn on suggestions
Auto-suggest helps you quickly narrow down your search results by suggesting possible matches as you type.
My Ideas
(0 Idea Submissions)Latest Contributions by MarkCunningham1
|
POST
|
I use the "Enable Editor Tracking" Tool. This allows you to assign the "Last Editor Field" to the LASTEDITOR field and the "Last edit Date" field to LASTUPDATE.
... View more
11-06-2014
01:25 PM
|
2
|
1
|
679
|
|
POST
|
Thank you for your response I decided to move in a slightly different direction. Where I scrapped the TOC widget and just went with the generate check-boxes. <!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"> <title>HurricaneTracker</title> <link rel="stylesheet" href="http://js.arcgis.com/3.8/js/dojo/dijit/themes/tundra/tundra.css"> <link rel="stylesheet" href="http://js.arcgis.com/3.8/js/esri/css/esri.css"> <style> html, body { height: 100%; width: 100%; margin: 0; padding: 0; background-color: #000000; } #map { height: 100%; width:100%; margin: 0; padding: 0; overflow: none; } legendDiv { display: none; } .esriControlsBR {display:none;} #header { margin:0px; padding: 0px; text-align:right; background: -webkit-gradient(linear, left top, left bottom, from(#005b8c), to(#1980b7)); background-color:#0072AF; color:#0072AF; border: solid 1px #000000; height: 56px; } #title { font-size:150%; color: #ffffff; text-align:center; margin: 2px; } #subfooter { font-size:small; color: #ffffff; font-size:13px; text-align:center; margin: 2px; } #LayerDrop { position: absolute; top: 20px; right: 20px; z-index: 50; } #appToolbarButtons{ float: right; vertical-align: middle; } #layerBTN { vertical-align: right; bottom: 15px; cursor: pointer ; margin-right: 5px; z-index: 50; cursor: pointer; right: 10px; width: 65px!important; padding: 5px; position: absolute; -moz-box-shadow:inset 0px 0px 35px 0px #ccd8e0; -webkit-box-shadow:inset 0px 0px 35px 0px #ccd8e0; box-shadow: 1px 6px 12px #0093CA inset, -1px -10px 5px #00ACEC inset, 1px 2px 1px rgba(0, 0, 0, 0); background-color: #00ACEC; background:-moz-linear-gradient( center top, #145bb3 5%, #468ccf 100% ); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#145bb3', endColorstr='#468ccf'); -webkit-border-top-left-radius:37px; -moz-border-radius-topleft:37px; border-top-left-radius:37px; -webkit-border-top-right-radius:37px; -moz-border-radius-topright:37px; border-top-right-radius:37px; -webkit-border-bottom-right-radius:37px; -moz-border-radius-bottomright:37px; border-bottom-right-radius:37px; -webkit-border-bottom-left-radius:37px; -moz-border-radius-bottomleft:37px; border-bottom-left-radius:37px; text-indent:0; display:inline-block; color:#FFFFFF; font-family:Arial; font-weight:bold; font-style:normal; text-decoration:none; text-align:center; text-shadow:0px 0px 0px #072038; } #LocateButton { position: absolute; top: 95px; left: 20px; z-index: 50; } #BasemapToggle { position: absolute; bottom: 30px; left: 30px; z-index: 50; width:59px; height:50px; } .BasemapToggle .basemapImage { width:55px; height:30px; overflow:hidden; } </style> <script src="http://js.arcgis.com/3.8/"></script> <script> var map; require([ "dojo/parser", "esri/map", "esri/dijit/LocateButton", "esri/dijit/BasemapToggle", "esri/layers/KMLLayer", "esri/InfoTemplate", "esri/layers/FeatureLayer", "dojo/_base/array", "esri/symbols/PictureMarkerSymbol", "esri/renderers/SimpleRenderer", "esri/dijit/Legend", "dijit/form/CheckBox", "dojo/dom", "dojo/dom-construct", "dijit/layout/BorderContainer", "dijit/layout/ContentPane", "dijit/Dialog", "dojo/domReady!" ], function (parser, Map, LocateButton, BasemapToggle, KMLLayer, InfoTemplate, FeatureLayer, array, PictureMarkerSymbol, SimpleRenderer, Legend, CheckBox, dom, domConstruct ) { map = new Map("map", { basemap: "national-geographic", fadeOnZoom: true, center: [-80.013, 32.622], zoom: 4 }); // create layout dijits parser.parse(); geoLocate = new LocateButton({ map: map }, "LocateButton"); geoLocate.startup(); var toggle = new BasemapToggle({ map: map, basemap: "satellite" }, "BasemapToggle"); toggle.startup(); var legendLayers = []; var kmlUrl = ""; var kml = new KMLLayer(kmlUrl, { id: "KML" }); kml.setRefreshInterval(5); var kmlHurricane = ""; var kmlH = new KMLLayer(kmlHurricane, { id: "Hurricane" }); kmlH.setRefreshInterval(10); kmlH.setVisibility(false); var kmlGaleURL = ""; var kmlGale = new KMLLayer(kmlGaleURL, { id: "Gale" }); kmlGale.setRefreshInterval(10); kmlGale.setVisibility(false); var kmlTropicalURL = ""; var kmlTropical = new KMLLayer(kmlTropicalURL, { id: "Tropical" }); kmlTropical.setRefreshInterval(3); kmlTropical.setVisibility(false); ////// var kmlRadarURL = ""; var kmlRadar = new KMLLayer(kmlRadarURL, { id: "Radar" }); kmlRadar.setRefreshInterval(7); kmlRadar.setVisibility(false); ////// var cities = new FeatureLayer( "http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Specialty/ESRI_StatesCitiesRivers_USA/MapServer/0", { mode: FeatureLayer.MODE_ONDEMAND, id: "City", outFields: ["*"] }); cities.setVisibility(false); /////////////////////////////////////////////////////////////////////////// ////Add layers to Legend ////This Also Sets Order of Layers //// legendLayers.push({ layer: cities, title: 'Cities' }); legendLayers.push({ layer: kmlH, title: 'Hurricane (64kt/73mph)' }); legendLayers.push({ layer: kmlGale, title: 'Gale (50kt/57mph)' }); legendLayers.push({ layer: kmlTropical, title: 'Tropical (34kt/ 39mph)' }); legendLayers.push({ layer: kmlRadar, title: 'Radar' }); legendLayers.push({ layer: kml, title: 'Path' }); ////////////////////////////////////////////////////////// ///////////// Check-Box Created//////////////////////////////////// map.on('layers-add-result', function () { //add check boxes array.forEach(legendLayers, function (layer) { var layerName = layer.title; var checkBox = new CheckBox({ name: "checkBox" + layer.layer.id, value: layer.layer.id, checked: layer.layer.visible }); checkBox.on("change", function () { var targetLayer = map.getLayer(this.value); targetLayer.setVisibility(!targetLayer.visible); this.checked = targetLayer.visible; }); //add the check box and label to the TOC domConstruct.place(checkBox.domNode, "toggle", "after"); var checkLabel = domConstruct.create('label', { 'for': checkBox.name, innerHTML: layerName }, checkBox.domNode, "after"); domConstruct.place("<br /><hr/>", checkLabel, "after"); }); }); map.addLayers([cities, kml, kmlH, kmlGale, kmlTropical, kmlRadar]); }); </script> </head> <body class="tundra"> <div id="content" data-dojo-type="dijit/layout/BorderContainer" design="headline" gutters="true" style="width: 100%; height: 100%; margin: 0;"> <div id="header" class="shadow roundedCorners" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'top'"> <div id="title">Tropical Tracker <div id="subfooter"> </div> </div> </div> <div id="map" data-dojo-type="dijit/layout/ContentPane" region="center"> <div id="appToolbarButtons"> <button id="layerBTN" type="button" onClick="myLayersDialog.show();"> Layers</button> </div> <div id="LocateButton"></div> <div id="BasemapToggle"></div> </div> </div> </div> <!--Start Layers Dialog Btn --> <div data-dojo-type="dijit/Dialog" data-dojo-id="myLayersDialog" style="width: 260px; height: 25em; overflow: auto;" title="Layers"> <div id="toggle" style="padding: 2px 2px;"></div> <div class="dijitDialogPaneActionBar"> <button data-dojo-type="dijit/form/Button" type="button" onClick="myLayersDialog.hide()">OK</button> </div> </div> <!--Start Legend Dialog BTN --> </body> </html>
... View more
07-10-2014
05:53 AM
|
0
|
0
|
324
|
|
POST
|
I would like to add the functionality so that when a user clicks on a polygon or point I am able to have an info-window appear. If someone could look at my code and tell me perhaps what I am missing. I would like to have the info-window information come from the same service being used in the time slider. Thanks <!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<!--The viewport meta tag is used to improve the presentation and behavior of the samples
on iOS devices-->
<meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
<title>cases 2010-2014</title>
<link rel="stylesheet" href="http://js.arcgis.com/3.9/js/dojo/dijit/themes/tundra/tundra.css">
<link rel="stylesheet" href="http://js.arcgis.com/3.9/js/esri/css/esri.css">
<style>
html, body {
height: 100%;
width: 100%;
margin: 0;
padding: 0;
font-family: helvetica, arial, sans-serif;
font-size: 90%;
color: #00151;
overflow: hidden;
}
#mapDiv {
padding: 0;
height:100%;
overflow: hidden;
background-color:#0072AF; color:#0072AF;
}
#bottomPanel {
margin: 0 auto;
left:15%;
position: absolute;
bottom: 1em;
border-radius: 100px;
width: 75%;
}
#title {
font-size:150%;
color: #ffffff;
text-align:center;
margin: 2px;
}
#subfooter {
font-size:small;
color: #ffffff;
font-size:13px;
text-align:center;
margin: 2px;
}
#header {
margin:0px;
padding: 0px;
text-align:right;
background: -webkit-gradient(linear, left top, left bottom, from(#005b8c), to(#1980b7));
background-color:#0072AF; color:#0072AF;
border: solid 1px #000000;
height: 56px;
}
#timeInfo{
border-radius: 7px;
border: solid 2px #ccc;
background-color: #fff;
display: block;
padding: 5px;
position: relative;
text-align: center;
z-index: 99;
}
</style>
<script src="http://js.arcgis.com/3.9/"></script>
<script>
var map;
var infoTemplate;
require([
"esri/map",
"esri/InfoTemplate",
"esri/layers/ArcGISDynamicMapServiceLayer",
"esri/TimeExtent",
"esri/dijit/TimeSlider",
"dojo/_base/array",
"dojo/dom",
"dijit/layout/BorderContainer",
"dijit/layout/ContentPane",
"dojo/domReady!"
], function(
Map,
InfoTemplate,
ArcGISDynamicMapServiceLayer,
TimeExtent,
TimeSlider,
arrayUtils,
dom
) {
map = new Map("mapDiv", {
basemap: "streets",
center: [-81.00, 33.500],
zoom: 8
});
// InfoTemplate
// var template = new InfoTemplate("Cases", "<tr> <td>${NAME}</td></tr><br/> <td>Total:</td><td>${TOTAL}</td></tr>");
//Infowindow Template
//var infoTemplate = new InfoTemplate();
// infoTemplate.setTitle("${NAME}");
// infoTemplate.setContent("${TOTAL}");
////Infowindow Template
var infoTemplate = new InfoTemplate();
infoTemplate.setTitle("${NAME}");
infoTemplate.setContent("${*}");
var opLayer = new ArcGISDynamicMapServiceLayer("CASESLAYERSERVERURL",{
infoTemplate: infoTemplate,
opacity: 0.8,
outFields: ["*"]
//outFields:["NAME", "TOTAL"]
});
//opLayer.setVisibleLayers([0]);
var countyLayer = new ArcGISDynamicMapServiceLayer("COUNTYLAYERSERVERURL", {
id: 'countyLayer',
});
//Add Layers to Map
map.addLayers([ countyLayer,opLayer]); map.infoWindow.resize(200, 75);
map.on("layers-add-result", initSlider);
function initSlider() {
var timeSlider = new TimeSlider({
style: "width: 100%;"
}, dom.byId("timeSliderDiv"));
map.setTimeSlider(timeSlider);
var timeExtent = new TimeExtent();
timeExtent.startTime = new Date("1/1/2010 UTC");
timeExtent.endTime = new Date("12/31/2014 UTC");
timeSlider.setThumbCount(2);
timeSlider.createTimeStopsByTimeInterval(timeExtent, 1, "esriTimeUnitsYears");
timeSlider.setThumbIndexes([0,1]);
timeSlider.setThumbMovingRate(3000);
timeSlider.startup();
//add labels for every other time stop
var labels = arrayUtils.map(timeSlider.timeStops, function(timeStop, i) {
if ( i % 2 === 0 ) {
return timeStop.getUTCFullYear();
} else {
return "";
}
});
timeSlider.setLabels(labels);
// timeSlider.on("time-extent-change", function(evt) {
// var startValString = evt.startTime.getUTCFullYear();
// var endValString = evt.endTime.getUTCFullYear();
// dom.byId("daterange").innerHTML = "<i>" + startValString + " and " + endValString + "<\/i>";
// });
}
});
</script>
</head>
<body class="tundra">
<div id="content" data-dojo-type="dijit/layout/BorderContainer" design="headline" gutters="true" style="width: 100%; height: 100%; margin: 0;">
<div id="header" class="shadow roundedCorners" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'top'">
<div id="title"> Title
<div id="subfooter">Subtitle</div>
</div>
</div><!-- End Header -->
<div id="mapDiv" data-dojo-type="dijit/layout/ContentPane" region="center">
<div id="bottomPanel" data-dojo-type="dijit/layout/ContentPane" region="bottom">
<div id="timeInfo">
<div> Cases <span id="daterange"> By Years</span></div>
<div id="timeSliderDiv"></div>
</div>
</div>
</div>
</body>
</html>
... View more
06-25-2014
05:52 AM
|
0
|
0
|
816
|
|
POST
|
Is there a way to change the "default" color of a published map service layer to something that a user can select and print out? Currently I have a polygon layer published out with a scaled color scheme. I would like users to be able to change / choose a color ramp based on what suites them. This would save time instead of publishing out a new map service every time they would like a color change. Thank you
... View more
06-06-2014
10:05 AM
|
0
|
0
|
472
|
|
POST
|
[ATTACH=CONFIG]33521[/ATTACH]I currently have a Table of Contents working from a Dynamic Map Service under the Layers button. I would like to add a few RSS layers under the RSS Layers Button with a check box and name. I can't figure out why the checkbox is not appearing for my rss layer. I assume has to do with map.on("layers-add-result",...... <!DOCTYPE html>
<html>
<head>
<title>Map</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
<link rel="stylesheet" href="http://js.arcgis.com/3.8/js/dojo/dijit/themes/tundra/tundra.css">
<link rel="stylesheet" href="http://js.arcgis.com/3.8/js/esri/css/esri.css">
<link rel="stylesheet" type="text/css" href="http://gmaps-utility-gis.googlecode.com/svn/tags/agsjs/latest/build/agsjs/css/agsjs.css" />
<style>
html, body {
height: 100%;
width: 100;
margin: 0;
padding: 0;
font-family: helvetica, arial, sans-serif;
font-size: 90%;
color: #00151;
}
#map {
padding: 0;
overflow: hidden;
background-color:#0072AF; color:#0072AF;
}
#header {
margin:0px;
padding: 0px;
text-align:right;
background: -webkit-gradient(linear, left top, left bottom, from(#005b8c), to(#1980b7));
background-color:#0072AF; color:#0072AF;
border: solid 1px #000000;
height: 56px;
}
#bookmarks-wrapper {
position: absolute;
z-index: 40;
top: 15px;
right: 30px;
background: transparent;
font-size: 12pt;
color: #444;
}
#Search-wrapper {
position: absolute;
z-index: 40;
top: 15px;
right: 140px;
background: transparent;
font-size: 12pt;
color: #444;
}
#RssLayers-wrapper {
position: absolute;
z-index: 40;
top: 15px;
right: 265px;
background: transparent;
font-size: 12pt;
color: #444;
}
#title {
font-size:150%;
color: #ffffff;
text-align:center;
margin: 2px;
}
#subfooter {
font-size:small;
color: #ffffff;
font-size:13px;
text-align:center;
margin: 2px;
}
.esriControlsBR {
display: none;
}
/* this line hides layers when out of scale for the inline TOC
.agsjsTOCOutOfScale {
display: none
}*/
</style>
<script type="text/javascript">
var djConfig = {parseOnLoad: true, packages: [{"name": "agsjs","location": "http://gmaps-utility-gis.googlecode.com/svn/tags/agsjs/latest/build/agsjs" }] };
</script>
<script src="http://js.arcgis.com/3.8/"></script>
<script type="text/javascript">
var map, toc, dynaLayer1;
require(["dojo/_base/connect",
"dojo/parser",
"esri/urlUtils",
"dojo/on",
"agsjs/dijit/TOC",
"esri/map",
"esri/layers/ArcGISDynamicMapServiceLayer",
"esri/dijit/Geocoder",
"esri/layers/GeoRSSLayer",
"esri/InfoTemplate",
"dojo/_base/array",
"esri/symbols/PictureMarkerSymbol",
"esri/renderers/SimpleRenderer",
"dijit/form/CheckBox",
"dojo/dom",
"dojo/dom-construct",
"dijit/form/DropDownButton",
"dijit/form/Button",
"dijit/layout/BorderContainer",
"dijit/layout/ContentPane",
"dojo/fx",
"dojo/domReady!"],
function (connect, parser,urlUtils, on, TOC, Map, ArcGISDynamicMapServiceLayer, Geocoder,GeoRSSLayer,InfoTemplate,array, PictureMarkerSymbol, SimpleRenderer, CheckBox, dom, domConstruct) {
//call the parser to create the layout dijits
parser.parse();
map = new Map("map", {
center: [-93.00, 35.768],
zoom: 4,
basemap: "streets"
});
///Proxy
// Dyanmic layer For Table of Contents
dynaLayer1 = new ArcGISDynamicMapServiceLayer("http://maps5.gisworkshop.com/ArcGIS/rest/services/McKenzieTaxDirector/MapServer");
map.on('layer-add-result', function (e) {
dynaLayer1.setVisibleLayers([0]);
toc = new TOC({
map: map,
layerInfos: [{
layer: dynaLayer1,
title: "McKenzie Parcels",
collapsed: true,
slider: false
}]
}, 'tocDiv');
toc.startup();
});
map.addLayer(dynaLayer1);
///Geocoding Service
var geocoder = new Geocoder({
placeholder: "",
url: "",
map: map,
autoComplete: true,
},"search");
geocoder.startup();
// var georssUrl = "http://geocommons.com/overlays/116926.atom"; // S.F. and East Bay Breweries http://geocommons.com/overlays/116926
var rssBeer = new GeoRSSLayer("http://geocommons.com/overlays/116926.atom", {id: "Beer"});
rssBeer.on("load", function () {
//domStyle.set("loading", "display", "none");
// create an info template
var template = new InfoTemplate("${title}", "<tr><td></td><td>${description}</td></tr><br/><br/><tr><td> <a href=${link} target=_blank> BeerLine </a></td></tr></br>");
// set the info template for the feature layers that make up the GeoRSS layer
// the GeoRSS layer contains one feature layer for each geometry type
var layers = rssBeer.getFeatureLayers();
var picRenderer = new PictureMarkerSymbol("http://static.arcgis.com/images/Symbols/Basic/RedShinyPin.png", 21, 21);
var georssRenderer = new SimpleRenderer(picRenderer);
array.forEach(layers, function (l) {
l.setInfoTemplate(template);
l.setRenderer(georssRenderer)
});
});
///////////////////////////////////////////////////////////////////////////
//add the legend
map.on("layers-add-result", function (evt) {
var layerInfo = array.map(evt.layers, function (layer,
index) {
return {
layer: layer.layer,
title: layer.layer.name
};
});
//add check boxes
array.forEach(layerInfo,
function (layer) {
var layerName = layer.title;
if (layer.layer.id === "Beer") { layerName = "My Beer";}
var checkBox = new CheckBox({
name: "checkBox" + layer.layer.id,
value: layer.layer.id,
checked: layer.layer.visible,
onChange: function (evt) {
var clayer = map.getLayer(this.value);
clayer.setVisibility(!clayer.visible);
this.checked = clayer.visible;
}
});
//add the check box and label to the TOC
domConstruct.place(checkBox.domNode, "toggle",
"after");
var checkLabel = domConstruct.create('label', {
'for': checkBox.name,
innerHTML: layerName
}, checkBox.domNode, "after");
domConstruct.place("<br />", checkLabel,
"after");
});
});
map.addLayers([rssBeer]);
}); // End Main Function ///////
</script>
</head>
<body class="tundra">
<div id="content" data-dojo-type="dijit/layout/BorderContainer" design="headline" gutters="true" style="width: 100%; height: 100%; margin: 0;">
<div id="header" class="shadow roundedCorners" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'top'">
<div id="title">Title Main
<div id="subfooter">SubTitle</div>
</div>
<!-- Bookmarks widget inside a Drop Down Button -->
<div id="bookmarks-wrapper">
<div data-dojo-type="dijit/form/DropDownButton" region="top"> <span>Layers</span>
<div data-dojo-type="dijit/TooltipDialog">
<div id="tocDiv"></div>
</div>
</div>
</div>
<!-- Search widget inside a Drop Down Button -->
<div id="Search-wrapper">
<div data-dojo-type="dijit/form/DropDownButton" region="top"> <span>Address</span>
<div data-dojo-type="dijit/TooltipDialog">
<div id="search"></div>
</div>
</div>
</div>
<!-- Search widget inside a Drop Down Button -->
<div id="RssLayers-wrapper">
<div data-dojo-type="dijit/form/DropDownButton" region="top"> <span>Rss Layers</span>
<div data-dojo-type="dijit/TooltipDialog">
<h3>Layers</h3>
<br>
<div id="toggle" style="padding: 2px 2px;"></div>
</div>
</div>
</div>
</div><!-- End Header -->
<div id="map" data-dojo-type="dijit/layout/ContentPane" region="center">
</div> <!-- End Map-->
</div>
</div>
</body>
</html>
... View more
05-01-2014
05:18 AM
|
0
|
2
|
895
|
|
POST
|
Perhaps I should start a new Thread? I am wanting to add a label to a kml layer currently it displays as "undefined" I have tried to add a {<title> </title> } element to the raw kml file without any success. [ATTACH=CONFIG]32954[/ATTACH] <!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
<title>RssToggle</title>
<link rel="stylesheet" href="http://js.arcgis.com/3.8/js/dojo/dijit/themes/tundra/tundra.css">
<link rel="stylesheet" href="http://js.arcgis.com/3.8/js/esri/css/esri.css">
<style>
html, body { height: 100%; width: 100%; margin: 0; padding: 0; }
#map { height: 100%; margin: 0; padding: 0; }
#metaLegend {
position: absolute;
left: 20px;
bottom: 20px;
width: 20em;
height: 5em;
z-index: 40;
background: #fff;
color: #777;
padding: 5px;
border: 2px solid #666;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
font-family: arial;
font-size: 0.9em;
}
#metaLegend h3 {
color: #666;
font-size: 1.1em;
padding: 0px;
margin: 0px;
display: inline-block;
}
#metac {
position: absolute;
left: 20px;
bottom: 20px;
width: 20em;
height: 5em;
z-index: 40;
background: #fff;
color: #777;
padding: 5px;
border: 2px solid #666;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
font-family: arial;
font-size: 0.9em;
}
#metac h3 {
color: #666;
font-size: 1.1em;
padding: 0px;
margin: 0px;
display: inline-block;
}
legendDiv {
display:none;}
</style>
<script src="http://js.arcgis.com/3.8/"></script>
<script>
var map;
require([
"esri/map",
"esri/layers/KMLLayer",
"esri/layers/GeoRSSLayer",
"esri/InfoTemplate",
"dojo/parser",
"esri/layers/FeatureLayer",
"dojo/_base/array",
"esri/symbols/PictureMarkerSymbol",
"esri/renderers/SimpleRenderer",
"esri/dijit/Legend",
"dijit/form/CheckBox","dojo/dom", "dojo/dom-construct",
"dijit/layout/BorderContainer",
"dijit/layout/ContentPane",
"dojo/domReady!"
], function(
Map, KMLLayer, GeoRSSLayer, InfoTemplate,
parser, FeatureLayer,array, PictureMarkerSymbol, SimpleRenderer, Legend,CheckBox, dom, domConstruct
) {
map = new esri.Map("map",{
basemap: "oceans",
center: [-122.399, 37.78],
zoom: 9
});
// create layout dijits
parser.parse();
var kmlUrl = "http://dl.dropbox.com/u/2654618/kml/Wyoming.kml";
var kml = new KMLLayer(kmlUrl);
var cities = new FeatureLayer(
"http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Specialty/ESRI_StatesCitiesRivers_USA/MapServer/0", {
mode: FeatureLayer.MODE_ONDEMAND,
outFields: ["*"]
});
// var georssUrl = "http://geocommons.com/overlays/116926.atom"; // S.F. and East Bay Breweries http://geocommons.com/overlays/116926
var georss = new GeoRSSLayer("http://geocommons.com/overlays/116926.atom");
georss.on("load", function() {
//domStyle.set("loading", "display", "none");
// create an info template
var template = new InfoTemplate("${address}", "${zip}");
// set the info template for the feature layers that make up the GeoRSS layer
// the GeoRSS layer contains one feature layer for each geometry type
var layers = georss.getFeatureLayers();
var picRenderer = new PictureMarkerSymbol("http://static.arcgis.com/images/Symbols/Basic/RedShinyPin.png", 21, 21);
var georssRenderer = new SimpleRenderer(picRenderer);
array.forEach(layers, function(l) {
l.setInfoTemplate(template);
l.setRenderer(georssRenderer)
});
});
///////////////////////////////////////////////////////////////////////////
//////////////////////////////////////////////////////////
//add the legend
map.on("layers-add-result", function (evt) {
var layerInfo = array.map(evt.layers, function (layer,
index) {
return {
layer: layer.layer,
title: layer.layer.name
};
});
if (layerInfo.length > 0) {
var legendDijit = new Legend({
map: map,
layerInfos: layerInfo
}, "legendDiv");
legendDijit.startup();
}
//add check boxes
array.forEach(layerInfo,
function (layer) {
var layerName = layer.title;
var checkBox = new CheckBox({
name: "checkBox" + layer.layer.id,
value: layer.layer.id,
checked: layer.layer.visible,
onChange: function (evt) {
var clayer = map.getLayer(this.value);
clayer.setVisibility(!clayer.visible);
this.checked = clayer.visible;
}
});
//add the check box and label to the TOC
domConstruct.place(checkBox.domNode, "toggle",
"after");
var checkLabel = domConstruct.create('label', {
'for': checkBox.name,
innerHTML: layerName
}, checkBox.domNode, "after");
domConstruct.place("<br />", checkLabel,
"after");
});
});
map.addLayers([georss,cities, kml]);
});
</script>
</head>
<body class="tundra">
<div data-dojo-type="dijit/layout/BorderContainer"
data-dojo-props="design:'headline',gutters:false"
style="width: 100%; height: 100%; margin: 0;">
<div id="map"
data-dojo-type="dijit/layout/ContentPane"
data-dojo-props="region:'center'">
<div id="metaLegend"style="display: none;">
<h3>Legend</h3>
<br>
<div id="legendDiv"></div>
</div>
<div id="metac">
<h3>Layers</h3>
<br>
<div id="toggle" style="padding: 2px 2px;"></div>
</div> </div> </div>
</div>
</body>
</html>
... View more
04-09-2014
07:07 AM
|
0
|
0
|
265
|
|
POST
|
What would be the best way to add/use a custom label next to check box instead of using the layer name? http://jsbin.com/majom/1/edit
... View more
04-08-2014
08:57 AM
|
0
|
0
|
962
|
|
POST
|
Thank you for your response. I think that stands true when you only have feature layers, however I am using an rss feed. If you copy and past the code into the sandbox or even into a html document and put it on the web hit refresh a few times you will see the layers change order.
... View more
04-03-2014
09:42 AM
|
0
|
0
|
791
|
|
POST
|
I am trying to figure out the best way to set layers according to a specified order. The layers currently order themselves randomly( I assume in the order they load) this becomes more of an issue when I add multiple layers. Thank you for the help. <!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
<title>RssToggle</title>
<link rel="stylesheet" href="http://js.arcgis.com/3.8/js/dojo/dijit/themes/tundra/tundra.css">
<link rel="stylesheet" href="http://js.arcgis.com/3.8/js/esri/css/esri.css">
<style>
html, body { height: 100%; width: 100%; margin: 0; padding: 0; }
#map { height: 100%; margin: 0; padding: 0; }
#metaLegend {
position: absolute;
left: 20px;
bottom: 20px;
width: 20em;
height: 5em;
z-index: 40;
background: #fff;
color: #777;
padding: 5px;
border: 2px solid #666;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
font-family: arial;
font-size: 0.9em;
}
#metaLegend h3 {
color: #666;
font-size: 1.1em;
padding: 0px;
margin: 0px;
display: inline-block;
}
#metac {
position: absolute;
left: 20px;
bottom: 20px;
width: 20em;
height: 5em;
z-index: 40;
background: #fff;
color: #777;
padding: 5px;
border: 2px solid #666;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
font-family: arial;
font-size: 0.9em;
}
#metac h3 {
color: #666;
font-size: 1.1em;
padding: 0px;
margin: 0px;
display: inline-block;
}
legendDiv {
display:none;}
</style>
<script src="http://js.arcgis.com/3.8/"></script>
<script>
var map;
require([
"esri/map",
"esri/layers/GeoRSSLayer",
"esri/InfoTemplate",
"dojo/parser",
"esri/layers/FeatureLayer",
"dojo/_base/array",
"esri/symbols/PictureMarkerSymbol",
"esri/renderers/SimpleRenderer",
"esri/dijit/Legend",
"dijit/form/CheckBox","dojo/dom", "dojo/dom-construct",
"dijit/layout/BorderContainer",
"dijit/layout/ContentPane",
"dojo/domReady!"
], function(
Map, GeoRSSLayer, InfoTemplate,
parser, FeatureLayer,array, PictureMarkerSymbol, SimpleRenderer, Legend,CheckBox, dom, domConstruct
) {
map = new esri.Map("map",{
basemap: "oceans",
center: [-122.399, 37.78],
zoom: 9
});
// create layout dijits
parser.parse();
var cities = new FeatureLayer(
"http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Specialty/ESRI_StatesCitiesRivers_USA/MapServer/0", {
mode: FeatureLayer.MODE_ONDEMAND,
outFields: ["*"]
});
// var georssUrl = "http://geocommons.com/overlays/116926.atom"; // S.F. and East Bay Breweries http://geocommons.com/overlays/116926
var georss = new GeoRSSLayer("http://geocommons.com/overlays/116926.atom");
georss.on("load", function() {
//domStyle.set("loading", "display", "none");
// create an info template
var template = new InfoTemplate("${address}", "${zip}");
// set the info template for the feature layers that make up the GeoRSS layer
// the GeoRSS layer contains one feature layer for each geometry type
var layers = georss.getFeatureLayers();
var picRenderer = new PictureMarkerSymbol("http://static.arcgis.com/images/Symbols/Basic/RedShinyPin.png", 21, 21);
var georssRenderer = new SimpleRenderer(picRenderer);
array.forEach(layers, function(l) {
l.setInfoTemplate(template);
l.setRenderer(georssRenderer)
});
});
///////////////////////////////////////////////////////////////////////////
//////////////////////////////////////////////////////////
//add the legend
map.on("layers-add-result", function (evt) {
var layerInfo = array.map(evt.layers, function (layer,
index) {
return {
layer: layer.layer,
title: layer.layer.name
};
});
if (layerInfo.length > 0) {
var legendDijit = new Legend({
map: map,
layerInfos: layerInfo
}, "legendDiv");
legendDijit.startup();
}
//add check boxes
array.forEach(layerInfo,
function (layer) {
var layerName = layer.title;
var checkBox = new CheckBox({
name: "checkBox" + layer.layer.id,
value: layer.layer.id,
checked: layer.layer.visible,
onChange: function (evt) {
var clayer = map.getLayer(this.value);
clayer.setVisibility(!clayer.visible);
this.checked = clayer.visible;
}
});
//add the check box and label to the TOC
domConstruct.place(checkBox.domNode, "toggle",
"after");
var checkLabel = domConstruct.create('label', {
'for': checkBox.name,
innerHTML: layerName
}, checkBox.domNode, "after");
domConstruct.place("<br />", checkLabel,
"after");
});
});
map.addLayers([georss,cities]);
});
</script>
</head>
<body class="tundra">
<div data-dojo-type="dijit/layout/BorderContainer"
data-dojo-props="design:'headline',gutters:false"
style="width: 100%; height: 100%; margin: 0;">
<div id="map"
data-dojo-type="dijit/layout/ContentPane"
data-dojo-props="region:'center'">
<div id="metaLegend"style="display: none;">
<h3>Legend</h3>
<br>
<div id="legendDiv"></div>
</div>
<div id="metac">
<h3>Layers</h3>
<br>
<div id="toggle" style="padding: 2px 2px;"></div>
</div> </div> </div>
</div>
</body>
</html>
... View more
04-02-2014
09:24 AM
|
0
|
3
|
1240
|
|
POST
|
Thank you for the quick responses. This is what I was looking for. cities.setVisibility(false);
... View more
03-26-2014
04:38 AM
|
0
|
0
|
387
|
|
POST
|
I am wanting to set on initial load of the webmap the checkboxes for my layers to be unchecked(not display). Although I would still need specific layers turned on (Checked). I have gotten this far. You can just copy and paste the code in the Sandbox. Thanks for the help. <!doctype html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"> <title>RssToggle</title> <link rel="stylesheet" href="http://js.arcgis.com/3.8/js/dojo/dijit/themes/tundra/tundra.css"> <link rel="stylesheet" href="http://js.arcgis.com/3.8/js/esri/css/esri.css"> <style> html, body { height: 100%; width: 100%; margin: 0; padding: 0; } #map { height: 100%; margin: 0; padding: 0; } #metaLegend { position: absolute; left: 20px; bottom: 20px; width: 20em; height: 5em; z-index: 40; background: #fff; color: #777; padding: 5px; border: 2px solid #666; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; font-family: arial; font-size: 0.9em; } #metaLegend h3 { color: #666; font-size: 1.1em; padding: 0px; margin: 0px; display: inline-block; } #metac { position: absolute; left: 20px; bottom: 125px; width: 20em; height: 5em; z-index: 40; background: #fff; color: #777; padding: 5px; border: 2px solid #666; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; font-family: arial; font-size: 0.9em; } #metac h3 { color: #666; font-size: 1.1em; padding: 0px; margin: 0px; display: inline-block; } </style> <script src="http://js.arcgis.com/3.8/"></script> <script> var map; require([ "esri/map", "esri/layers/GeoRSSLayer", "esri/InfoTemplate", "dojo/parser", "esri/layers/FeatureLayer", "dojo/_base/array", "esri/symbols/PictureMarkerSymbol", "esri/renderers/SimpleRenderer", "esri/dijit/Legend", "dijit/form/CheckBox","dojo/dom", "dojo/dom-construct", "dijit/layout/BorderContainer", "dijit/layout/ContentPane", "dojo/domReady!" ], function( Map, GeoRSSLayer, InfoTemplate, parser, FeatureLayer,array, PictureMarkerSymbol, SimpleRenderer, Legend,CheckBox, dom, domConstruct ) { map = new esri.Map("map",{ basemap: "oceans", center: [-122.399, 37.78], zoom: 9 }); // create layout dijits parser.parse(); var cities = new FeatureLayer( "http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Specialty/ESRI_StatesCitiesRivers_USA/MapServer/0", { mode: FeatureLayer.MODE_ONDEMAND, outFields: ["*"] }); // var georssUrl = "http://geocommons.com/overlays/116926.atom"; // S.F. and East Bay Breweries http://geocommons.com/overlays/116926 var georss = new GeoRSSLayer("http://geocommons.com/overlays/116926.atom"); georss.on("load", function() { //domStyle.set("loading", "display", "none"); // create an info template var template = new InfoTemplate("${address}", "${zip}"); // set the info template for the feature layers that make up the GeoRSS layer // the GeoRSS layer contains one feature layer for each geometry type var layers = georss.getFeatureLayers(); var picRenderer = new PictureMarkerSymbol("http://static.arcgis.com/images/Symbols/Basic/RedShinyPin.png", 21, 21); var georssRenderer = new SimpleRenderer(picRenderer); array.forEach(layers, function(l) { l.setInfoTemplate(template); l.setRenderer(georssRenderer) }); }); //add the legend map.on("layers-add-result", function (evt) { var layerInfo = array.map(evt.layers, function (layer, index) { return { layer: layer.layer, title: layer.layer.name }; }); if (layerInfo.length > 0) { var legendDijit = new Legend({ map: map, layerInfos: layerInfo }, "legendDiv"); legendDijit.startup(); } //add check boxes array.forEach(layerInfo, function (layer) { var layerName = layer.title; var checkBox = new CheckBox({ name: "checkBox" + layer.layer.id, value: layer.layer.id, checked: layer.layer.visible, onChange: function (evt) { var clayer = map.getLayer(this.value); clayer.setVisibility(!clayer.visible); this.checked = clayer.visible; } }); //add the check box and label to the TOC domConstruct.place(checkBox.domNode, "toggle", "after"); var checkLabel = domConstruct.create('label', { 'for': checkBox.name, innerHTML: layerName }, checkBox.domNode, "after"); domConstruct.place("<br />", checkLabel, "after"); }); }); map.addLayers([georss,cities]); }); </script> </head> <body class="tundra"> <div data-dojo-type="dijit/layout/BorderContainer" data-dojo-props="design:'headline',gutters:false" style="width: 100%; height: 100%; margin: 0;"> <div id="map" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'center'"> <div id="metaLegend"> <h3>Legend</h3> <br> <div id="legendDiv"></div> </div> <div id="metac"> <h3>Layers</h3> <br> <div id="toggle" style="padding: 2px 2px;"></div> </div> </div> </div> </div> </body> </html> [ATTACH=CONFIG]32487[/ATTACH]
... View more
03-25-2014
08:05 AM
|
0
|
3
|
1445
|
|
POST
|
I figured it out. Thanks for the reply. <!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"> <title>Basemap Toggle</title> <link rel="stylesheet" type="text/css" href="http://js.arcgis.com/3.8/js/esri/css/esri.css"> <style> html, body { height: 100%; width: 100%; margin: 0; } body { background-color: white; overflow: hidden; font-family:"Trebuchet MS"; } #header { background-image: url(../images/banner.jpg); background-repeat: repeat-x; margin: 2px; border: solid 2px #224a54; color: white; font-size: 18pt; text-align: left; font-weight: bold; height: 45px; } #subheader { font-size: small; color: white; padding-left: 20px; } #leftPane { width: 20%; margin: 1px; border: solid 2px #224a54; } #footer { margin: 2px; border: solid 2px #224a54; background-color: #ecefe4; color: #3f3f3f; font-size: 10pt; text-align: center; height: 30px; } .dijitTabInnerDiv { background-color: #ecefe4; } #map { margin: 1px; border: solid 2px #224a54; -moz-border-radius: 4px; } #BasemapToggle { position: absolute; top: 20px; right: 20px; z-index: 50; } #legendPane { border: solid #97DCF2 1px; } </style> <script> dojoConfig = { parseOnLoad: true } </script> <script src="http://js.arcgis.com/3.8/"></script> <script> var map; require( ["dojo/parser", "esri/layers/GeoRSSLayer", "dijit/layout/BorderContainer", "dijit/layout/ContentPane", "dijit/layout/AccordionContainer", "esri/map", "esri/dijit/BasemapToggle", "esri/layers/FeatureLayer", "dojo/on", "esri/dijit/Legend", "dojo/_base/array", "dijit/form/CheckBox","dojo/dom", "dojo/dom-construct", "dojo/domReady!"], function (parser, GeoRSSLayer, BorderContainer, ContentPane, AccordionContainer, Map, BasemapToggle, FeatureLayer, on, Legend, array, CheckBox, dom, domConstruct) { parser.parse(); //Add Basemap var map = new Map("map", { sliderOrientation: "horizontal", center: [-90, 40], zoom: 8, basemap: "osm" }); //toggle Basemap var toggle = new BasemapToggle({ map: map, basemap: "satellite" }, "BasemapToggle"); toggle.startup(); //Add layer var url = "http://INSERTRSSFEEDHERE.xml"; var rssLayer = new GeoRSSLayer(url); var cities = new FeatureLayer( "http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Specialty/ESRI_StatesCitiesRivers_USA/MapServer/0", { mode: FeatureLayer.MODE_ONDEMAND, outFields: ["*"] }); var rivers = new FeatureLayer( "http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Specialty/ESRI_StatesCitiesRivers_USA/MapServer/1", { mode: FeatureLayer.MODE_ONDEMAND, outFields: ["*"] }); var states = new FeatureLayer( "http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Specialty/ESRI_StatesCitiesRivers_USA/MapServer/2", { mode: FeatureLayer.MODE_ONDEMAND, opacity: 0.5, outFields: ["*"] }); //add the legend map.on("layers-add-result", function (evt) { var layerInfo = array.map(evt.layers, function (layer, index) { return { layer: layer.layer, title: layer.layer.name }; }); if (layerInfo.length > 0) { var legendDijit = new Legend({ map: map, layerInfos: layerInfo }, "legendDiv"); legendDijit.startup(); } //add check boxes array.forEach(layerInfo, function (layer) { var layerName = layer.title; var checkBox = new CheckBox({ name: "checkBox" + layer.layer.id, value: layer.layer.id, checked: layer.layer.visible, onChange: function (evt) { var clayer = map.getLayer(this.value); clayer.setVisibility(!clayer.visible); this.checked = clayer.visible; } }); //add the check box and label to the TOC domConstruct.place(checkBox.domNode, "toggle", "after"); var checkLabel = domConstruct.create('label', { 'for': checkBox.name, innerHTML: layerName }, checkBox.domNode, "after"); domConstruct.place("<br />", checkLabel, "after"); }); }); map.addLayers([rssLayer, states, rivers, cities]); }); </script> </head> <body class="claro"> <div id="content" data-dojo-type="dijit.layout.BorderContainer" data-dojo-props="design:'headline', gutters:false" style="width: 100%; height: 100%; margin: 0;"> <div id="header" data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:'top'">Ahero Irrigation Scheme <div id="subheader">Turn on and off layers in the Layers panel to manipulate layers</div> </div> <div data-dojo-type="dijit.layout.ContentPane" id="leftPane" data-dojo-props="region:'left'"> <div data-dojo-type="dijit.layout.AccordionContainer"> <div data-dojo-type="dijit.layout.ContentPane" id="legendPane" data-dojo-props="title:'Legend', selected:true"> <div id="legendDiv"></div> </div> <div data-dojo-type="dijit.layout.ContentPane" data-dojo-props="title:'Layers'"> <span style="padding: 10px 0;">Click to toggle the visibilty of the various natural disasters</span> <div id="toggle" style="padding: 2px 2px;"></div> </div> </div> </div> <div id="map" data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:'center'" style="overflow: hidden;"> <div id="BasemapToggle"></div> </div> <div id="footer" data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:'bottom'">App Created by Oakar Services Ltd</div> </div> </body> </html>
... View more
03-24-2014
10:28 AM
|
0
|
0
|
233
|
|
POST
|
I would like to be able to turn on and off a Georss feed via a check box. I tried to use this example as a guide http://jsfiddle.net/D3J8H/12/ Thank you for the help. <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"> <!--The viewport meta tag is used to improve the presentation and behavior of the samples on iOS devices--> <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=yes"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="apple-mobile-web-app-capable" content="yes"> <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"> <title>Title</title> <link rel="stylesheet" href="http://js.arcgis.com/3.8/js/dojo/dijit/themes/claro/claro.css"> <link rel="stylesheet" href="http://js.arcgis.com/3.8/js/dojo/dojox/grid/resources/Grid.css"> <link rel="stylesheet" href="http://js.arcgis.com/3.8/js/esri/css/esri.css"> <style> html, body { height: 100%; margin: 0; padding: 0; width: 100%; } #map{ padding:0px; height: 100%; width: 100%; } #subfooter { font-size:small; color: #ffffff; font-size:13px; text-align:left; margin: 1px; } .roundedCorner { background-color: #FFFFFF; border: 1px solid #066DAB; border-radius: 4px; } #header { margin:0px; padding: 0px; background-color:#0072AF; color:#0072AF; border: solid 1px #000000; height: 50px; } #title { font-size:150%; color: #ffffff; text-align:left; margin: 2px; } #BasemapToggle { position: absolute; top: 20px; right: 20px; z-index: 50; } .esriControlsBR { display: none; } </style> <script>var dojoConfig = { parseOnLoad: true }</script> <script src="http://js.arcgis.com/3.8/"></script> <script> require([ "esri/map", "esri/dijit/BasemapToggle", "esri/layers/GeoRSSLayer", "esri/InfoTemplate", "dojo/parser", "dojo/_base/array", "dojo/dom-style", "esri/symbols/PictureMarkerSymbol", "esri/renderers/SimpleRenderer", "dojo/_base/Color", "dijit/layout/BorderContainer", "dijit/layout/ContentPane", "dojo/domReady!" ], function( Map,BasemapToggle, GeoRSSLayer, InfoTemplate, parser, arrayUtils, domStyle, PictureMarkerSymbol, SimpleRenderer, Color){ parser.parse(); var map; map = new Map("map", { basemap: "streets", center: [-83.018, 34.005], zoom: 8 }); var toggle = new BasemapToggle({ map: map, basemap: "satellite" }, "BasemapToggle"); toggle.startup(); //////////////////////////////////////////////////////////////////// var geoLayerRss = new GeoRSSLayer("http://www.AGeorrssFeed.xml"); geoLayerRss.on("load", function () { // domStyle.set("loading", "display", "none"); // create an info template var template = new InfoTemplate("${title}", "<tr><td></td><td>${description}</td></tr><br/><br/>"); // set the info template for the feature layers that make up the GeoRSS layer // the GeoRSS layer contains one feature layer for each geometry type var layers = geoLayerRss.getFeatureLayers(); var picRenderer = new PictureMarkerSymbol("http://static.arcgis.com/images/Symbols/Basic/GreenShinyPin.png", 21, 21); var georssRenderer = new SimpleRenderer(picRenderer); arrayUtils.forEach(layers, function (cl) { cl.setInfoTemplate(template); cl.setRenderer(georssRenderer) }); }); map.addLayers([geoLayerRss]); }); </script> </head> <body class="claro"> <div id="mainWindow" data-dojo-type="dijit/layout/BorderContainer" data-dojo-props="design:'headline', gutters:false" style="width: 100%; height: 100%; margin: 0;background-color: #000000;"> <div id="header" dojotype="dijit/layout/ContentPane" region="top"> <div id="title">Main Title<div id="subfooter"> SubTitleMain</div> </div> </div> <div id="map" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'center'" style="border-radius: 2px;"> <div id="BasemapToggle"></div> </div> </div> </body> </html>
... View more
03-24-2014
07:40 AM
|
0
|
2
|
596
|
|
POST
|
I am trying to add custom labels to graphics points. Each graphic having its own unique label. Thanks for the help. -------------------------------------------------------------- <!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"> <title>Basemap Toggle</title> <link rel="stylesheet" type="text/css" href="http://js.arcgis.com/3.8/js/esri/css/esri.css"> <style> html, body, #map { padding:0; margin:0; height:100%; } </style> <script src="//js.arcgis.com/3.8/"></script> <script> var map; require([ "esri/map", "dojo/domReady!" ], function( Map ) { var map = new Map("map", { center: [-81.057, 34.005], zoom: 7, basemap: "national-geographic", fadeOnZoom: true, slider: false, nav: false, wrapAround180: true, }); //------Add Point Graphic------------------------------ require(["dojo/_base/Color","esri/lang","esri/graphic","esri/layers/GraphicsLayer","esri/renderers/SimpleRenderer", "esri/geometry/Point","esri/tasks/FeatureSet","esri/symbols/SimpleMarkerSymbol","esri/symbols/SimpleLineSymbol", "dojo/domReady!" ], function( Color, esriLang, Graphic, GraphicsLayer, SimpleRenderer, Point, FeatureSet, SimpleMarkerSymbol, SimpleLineSymbol){ var facilityPointSymbol = new SimpleMarkerSymbol( SimpleMarkerSymbol.STYLE_CIRCLE, 15, new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID, new Color([60,50,255]), 2 ),new Color([169,250,20,0.6])); var facilitiesGraphicsLayer = new GraphicsLayer(); var facilityRenderer = new SimpleRenderer(facilityPointSymbol); facilitiesGraphicsLayer.setRenderer(facilityRenderer); map.addLayer(facilitiesGraphicsLayer); facilitiesGraphicsLayer.add(new Graphic(new Point(-83.538,33.063,map.spatialReference))); facilitiesGraphicsLayer.add(new Graphic(new Point(-82.959,34.025,map.spatialReference))); facilitiesGraphicsLayer.add(new Graphic(new Point(-81.039,35.025,map.spatialReference))); facilitiesGraphicsLayer.add(new Graphic(new Point(-81.099,36.001,map.spatialReference))); var facilities = new FeatureSet(); facilities.features = facilitiesGraphicsLayer.graphics; }); //---End Point Graphic-------- }); </script> </head> <body> <div id="map" class="map"> </div> </body> </html>
... View more
03-19-2014
11:40 AM
|
0
|
1
|
466
|
My kudoed posts
| Title | Kudos | Posted |
|---|---|---|
| 2 | 11-06-2014 01:25 PM |
Activity Feed
- Got a Kudo for Re: LASTUPDATE vs last_edited_date & LASTEDITOR vs last-edited_user. 11-11-2020 02:05 AM
- Kudoed Re: Update Failed - m values for KenKohnke. 03-15-2017 08:26 AM
- Got a Kudo for Re: LASTUPDATE vs last_edited_date & LASTEDITOR vs last-edited_user. 01-05-2017 07:43 AM
- Kudoed 1.2.89: Critical Update to the Survey123 mobile app for IsmaelChivite. 03-11-2016 11:20 AM
- Kudoed Re: Address Geocoding locator for 'US Dual Range Addresses' does not work in 10.2.1. for SrijanaTuladhar. 07-28-2015 08:22 AM
- Posted Re: LASTUPDATE vs last_edited_date & LASTEDITOR vs last-edited_user on State & Local Government Questions. 11-06-2014 01:25 PM
- Posted Re: Rss Checkbox / Table of Contents map.on issue??? on ArcGIS JavaScript Maps SDK Questions. 07-10-2014 05:53 AM
- Posted TimeSlider With Pop-UP on ArcGIS JavaScript Maps SDK Questions. 06-25-2014 05:52 AM
- Tagged TimeSlider With Pop-UP on ArcGIS JavaScript Maps SDK Questions. 06-25-2014 05:52 AM
- Tagged TimeSlider With Pop-UP on ArcGIS JavaScript Maps SDK Questions. 06-25-2014 05:52 AM
- Posted Color Change Polygon Map Service Layer on ArcGIS JavaScript Maps SDK Questions. 06-06-2014 10:05 AM
- Tagged Color Change Polygon Map Service Layer on ArcGIS JavaScript Maps SDK Questions. 06-06-2014 10:05 AM
- Tagged Color Change Polygon Map Service Layer on ArcGIS JavaScript Maps SDK Questions. 06-06-2014 10:05 AM
- Posted Rss Checkbox / Table of Contents map.on issue??? on ArcGIS JavaScript Maps SDK Questions. 05-01-2014 05:18 AM
- Tagged Rss Checkbox / Table of Contents map.on issue??? on ArcGIS JavaScript Maps SDK Questions. 05-01-2014 05:18 AM
- Tagged Rss Checkbox / Table of Contents map.on issue??? on ArcGIS JavaScript Maps SDK Questions. 05-01-2014 05:18 AM
- Posted Re: Dynamically Create Layer List Help on ArcGIS JavaScript Maps SDK Questions. 04-10-2014 04:41 AM
- Posted Re: Dynamically Create Layer List Help on ArcGIS JavaScript Maps SDK Questions. 04-09-2014 07:07 AM
- Posted Re: Dynamically Create Layer List Help on ArcGIS JavaScript Maps SDK Questions. 04-08-2014 08:57 AM
- Posted Re: Set order of layers? on ArcGIS JavaScript Maps SDK Questions. 04-03-2014 09:42 AM
Contact Me
| Online Status |
Offline
|
| Date Last Visited |
11-11-2020
02:24 AM
|