POST
|
For anyone wondering, I found another way to stop the mouse-drag initiating before the mouse-click on the map. Add another variable for the mouse down on the graphic and later remove the variable when done by double clicking. map.on("dbl-click", function(event){
undoPreEvents();
map.setMapCursor("default");
document.getElementById("popup1").style.display = "none";
dojo.stopEvent(event);
event.preventDefault();
event.stopPropagation();
console.log("Mouse Up");
});
function executeSchool1() {
document.getElementById("popup2").style.display = "block";
doPreEvents();
map.setMapCursor("url('images/yellow_crayon.cur'), auto");
executeSchool1EvtMouse = on(blocks, "mouse-down", function() {
document.getElementById("popup1").style.display = "block";
executeSchool1Evt = on(blocks, "mouse-move", function(e) {
gra = e.graphic.clone();
gra.attributes.ES_Num = 1;
//gra.setSymbol(sSymbol1);
schoolGL.add(gra);
calculatePopES();
document.getElementById("popup2").style.display = "none";
});
});
}
function executeSchool2(evt) {
document.getElementById("popup2").style.display = "block";
doPreEvents();
map.setMapCursor("url('images/green_crayon.cur'), auto");
executeSchool2EvtMouse = on(blocks, "mouse-down", function() {
document.getElementById("popup1").style.display = "block";
executeSchool2Evt = on(blocks, "mouse-move", function(e) {
gra = e.graphic.clone();
gra.attributes.ES_Num = 2;
//gra.setSymbol(sSymbol2);
schoolGL.add(gra);
calculatePopES();
document.getElementById("popup2").style.display = "none";
});
});
}
function clearEvts() {
if (executeSchool1Evt) {
executeSchool1Evt.remove();
executeSchool1EvtMouse.remove();
}
if (executeSchool2Evt) {
executeSchool2Evt.remove();
executeSchool2EvtMouse.remove();
}
}
... View more
09-06-2018
07:47 AM
|
0
|
0
|
851
|
POST
|
You can try setting the tag to 10 instead of 9 to see if it solves both your problems. You may need to set up a proxy when using IE9, see below. https://community.esri.com/thread/119562
... View more
09-06-2018
05:29 AM
|
0
|
0
|
618
|
POST
|
I had some problems with IE on other non-related issues. I added the below meta text to the head section of the HTML file to force IE to use an older version of IE instead of 11. Maybe it will help you. <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE9" />
... View more
09-05-2018
08:48 AM
|
1
|
3
|
618
|
POST
|
I tried that in several different ways. Below is an excerpt from the file. map.addLayers([blocks, schoolGL]);
dom.byId("SchoolsButton1").onclick = executeSchool1;
dom.byId("SchoolsButton2").onclick = executeSchool2;
function clearEvts() {
if (executeSchool1Evt) {
executeSchool1Evt.remove();
}
if (executeSchool2Evt) {
executeSchool2Evt.remove();
}
}
function doPreEvents() {
clearEvts();
map.disableClickRecenter();
map.disablePan();
map.disableShiftDoubleClickZoom();
map.disableDoubleClickZoom();
map.disableKeyboardNavigation();
map.disableRubberBandZoom();
}
function undoPreEvents() {
clearEvts();
//map.enableClickRecenter();
map.enablePan();
map.enableShiftDoubleClickZoom();
map.enableKeyboardNavigation();
map.enableRubberBandZoom();
//map.off();
}
function removeHandler() {
dom.byId("SchoolsButton1").removeEventListener("click", executeSchool1Evt);
dom.byId("SchoolsButton2").removeEventListener("click", executeSchool2Evt);
}
map.on("mouse-up", function(){
undoPreEvents();
removeHandler();
console.log("Mouse Up");
});
function executeSchool1() {
doPreEvents();
executeSchool1Evt = on(blocks, "mouse-drag", function(e) {
gra = e.graphic.clone();
gra.attributes.ES_Num = 1;
//gra.setSymbol(sSymbol1);
schoolGL.add(gra);
calculatePopES();
e.stopPropagation();
});
//dom.byId("SchoolsButton1").removeEventListener("mouseup", executeSchool1Evt);
}
function executeSchool2() {
doPreEvents();
executeSchool2Evt = on(blocks, "mouse-drag", function(e) {
gra = e.graphic.clone();
gra.attributes.ES_Num = 2;
//gra.setSymbol(sSymbol2);
schoolGL.add(gra);
calculatePopES();
e.stopPropagation();
});
}
... View more
08-31-2018
12:13 PM
|
0
|
0
|
851
|
POST
|
I have several buttons that select graphics and re-symbolizes the graphics depending on what button the user presses. The way the graphics are selected is by using a mouse-drag on the graphics layer. When pressing on the 1st button, it waits until I press down on the map before it starts the drag. I have another function that listens for a mouse-up to stop the drag. The problem is when I select the other buttons, the drag starts immediately. I need the drag to start when I press down on the map. Is this a normal functionality of the mouse-drag? As a side note, once the mouse-up function activates and I pan around the map, the buttons work as they should (the drag waits for the button click). How can I get the mouse-drag to listen for a mouse-click before immediately firing? I tried putting a mouse-down before the mouse-drag but the functionality of the map gave me issues. I used stopPropagation() as detailed in over forums. Using Javascript API 3.23
... View more
08-31-2018
11:10 AM
|
0
|
3
|
1081
|
POST
|
I have a very similar question. Using 10.5.1, I am able to geocode an address with a unit number with the geocoding toolbar in arcmap. It doesn't geocode to the unit address point because it doesn't exist but it geocodes to the nearest or closest match, in this case, the address without the unit number. When I try to batch geocode a table, I get zero matches instead of geocoding to the closest address point. My minimum candidate and match score are set super low and I have match with no zones set to Yes. Any help would be appreciative.
... View more
07-24-2018
12:28 PM
|
0
|
0
|
467
|
POST
|
Hello, I added a print widget to the script below but it does not create/export the pdf. I have tried the exact print widget on other applications and it executes as it should. The server error says "Layer "graphicsLayer1": Field 'SCHOOL' not part of schema for this feature collection. Failed to execute (ExportWebMap). " Is this a limitation of the print widget due to the graphics layer? Any workaround? <!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">
<title>Redistricting Test Map</title>
<link rel="stylesheet" href="https://js.arcgis.com/3.23/esri/css/esri.css">
<link rel="stylesheet" href="https://js.arcgis.com/3.23/dijit/themes/tundra/tundra.css">
<style>
html,
body {
height: 100%;
margin: 0;
padding: 0;
}
#mapDiv {
padding: 1px;
border: solid 2px #444;
-moz-border-radius: 4px;
border-radius: 4px;
}
#HomeButton {
position: absolute;
top: 95px;
left: 21px;
z-index: 50;
}
#header {
border: solid 2px #462d44;
background: #fff;
color: #444;
-moz-border-radius: 4px;
border-radius: 4px;
font-size: 1.2em;
padding-left: 20px;
}
#rightPane {
width: 250px;
padding: 1px;
border: solid 2px #444;
-moz-border-radius: 4px;
border-radius: 4px;
}
#info {
font-weight: bold;
font-size: 0.85em;
}
#legendDiv {
padding-top: 23px;
}
</style>
<script src="https://js.arcgis.com/3.23/"></script>
<script>
var map, gra, schoolGL;
var executeSchool1Evt, executeSchool2Evt, executeSchool3Evt;
var executeSchool4Evt, executeSchool5Evt;
require([
"esri/map", "esri/layers/FeatureLayer", "esri/dijit/Print",
"esri/InfoTemplate", "esri/toolbars/draw",
"esri/symbols/SimpleLineSymbol", "esri/symbols/SimpleFillSymbol",
"esri/dijit/HomeButton", "esri/graphic",
"esri/renderers/SimpleRenderer", "esri/Color",
"esri/config", "esri/dijit/Legend",
"esri/tasks/query", "esri/tasks/QueryTask",
"dojo/_base/array", "dijit/registry",
"dojo/query", "esri/tasks/LegendLayer",
"esri/tasks/StatisticDefinition", "esri/geometry/geometryEngine",
"dojo/store/Memory", "dojo/dom-construct",
"dijit/form/Button", "dojo/dom",
"dojo/on", "dojo/parser",
"esri/layers/GraphicsLayer", "esri/renderers/UniqueValueRenderer",
"dijit/layout/BorderContainer", "dijit/layout/ContentPane",
"dijit/layout/AccordionContainer", "dojo/domReady!"
], function(
Map, FeatureLayer, Print,
InfoTemplate, Draw,
SimpleLineSymbol, SimpleFillSymbol,
HomeButton, Graphic,
SimpleRenderer, Color,
esriConfig, Legend,
Query, QueryTask,
array, registry,
dojoQuery, LegendLayer,
StatisticDefinition, geometryEngine,
Memory, domConstruct,
Button, dom,
on, parser,
GraphicsLayer, UniqueValueRenderer
) {
parser.parse();
esriConfig.defaults.io.proxyUrl = "/proxy/";
var selectionToolbar;
map = new Map("mapDiv", {
basemap: "topo",
center: [-84.20, 33.78], // lon, lat
zoom: 11
});
var defaultSymbol = new SimpleFillSymbol().setColor(new Color([255, 255, 255, 0.5]));
//create renderer
var renderer = new SimpleRenderer(defaultSymbol);
var content = "<b>ES Population</b>: ${ES_Pop}" +
"<br><b>MS Population</b>: ${MS_Pop}" +
"<br><b>HS Population</b>: ${HS_Pop}";
var infoTemplate = new InfoTemplate("${ES_Name}", content);
var fields = ["ES_Name", "ES_Pop", "MS_Pop", "HS_Pop"];
var blocks = new FeatureLayer("http://gis.dekalb.k12.ga.us/arcgis_webadapter/rest/services/Redistricting/ES_Areas_Redist_Test/FeatureServer/0", {
mode: FeatureLayer.MODE_SNAPSHOT,
//infoTemplate: infoTemplate,
outFields: fields
});
var sSymbol1 = new SimpleFillSymbol().setColor(new Color([255, 255, 0, 0.5]));
var sSymbol2 = new SimpleFillSymbol().setColor(new Color([0, 255, 0, 0.5]));
var sSymbol3 = new SimpleFillSymbol().setColor(new Color([0, 0, 255, 0.5]));
var sSymbol4 = new SimpleFillSymbol().setColor(new Color([255, 0, 255, 0.5]));
var sSymbol5 = new SimpleFillSymbol().setColor(new Color([255, 0, 0, 0.5]));
schoolGL = new GraphicsLayer();
var uvRenderer = new UniqueValueRenderer(defaultSymbol, "SCHOOL");
uvRenderer.addValue({
value: 1,
symbol: sSymbol1,
label: "School 1",
description: "School 1"
});
uvRenderer.addValue({
value: 2,
symbol: sSymbol2,
label: "School 2",
description: "School 2"
});
uvRenderer.addValue({
value: 3,
symbol: sSymbol3,
label: "School 3",
description: "School 3"
});
uvRenderer.addValue({
value: 4,
symbol: sSymbol4,
label: "School 4",
description: "School 4"
});
uvRenderer.addValue({
value: 5,
symbol: sSymbol5,
label: "School 5",
description: "School 5"
});
on(schoolGL, "click", function(e) {
if (e.shiftKey) {
schoolGL.remove(e.graphic);
calculatePop();
}
});
blocks.setRenderer(uvRenderer);
schoolGL.setRenderer(uvRenderer);
map.addLayers([blocks, schoolGL]);
dom.byId("SchoolsButton1").onclick = executeSchool1;
dom.byId("SchoolsButton2").onclick = executeSchool2;
dom.byId("SchoolsButton3").onclick = executeSchool3;
dom.byId("SchoolsButton4").onclick = executeSchool4;
dom.byId("SchoolsButton5").onclick = executeSchool5;
function clearEvts() {
if (executeSchool1Evt) {
executeSchool1Evt.remove();
}
if (executeSchool2Evt) {
executeSchool2Evt.remove();
}
if (executeSchool3Evt) {
executeSchool3Evt.remove();
}
if (executeSchool4Evt) {
executeSchool4Evt.remove();
}
if (executeSchool5Evt) {
executeSchool5Evt.remove();
}
}
function doPreEvents() {
clearEvts();
map.disableClickRecenter();
map.disableShiftDoubleClickZoom();
map.disableKeyboardNavigation();
map.disableRubberBandZoom();
}
function undoPreEvents() {
clearEvts();
map.enableClickRecenter();
map.enableShiftDoubleClickZoom();
map.enableKeyboardNavigation();
map.enableRubberBandZoom();
}
function executeSchool1() {
doPreEvents();
executeSchool1Evt = on(blocks, "click", function(e) {
gra = e.graphic.clone();
gra.attributes.SCHOOL = 1;
//gra.setSymbol(sSymbol1);
schoolGL.add(gra);
calculatePop();
});
}
function executeSchool2() {
doPreEvents();
executeSchool2Evt = on(blocks, "click", function(e) {
gra = e.graphic.clone();
gra.attributes.SCHOOL = 2;
//gra.setSymbol(sSymbol2);
schoolGL.add(gra);
calculatePop();
});
}
function executeSchool3() {
doPreEvents();
executeSchool3Evt = on(blocks, "click", function(e) {
gra = e.graphic.clone();
gra.attributes.SCHOOL = 3;
//gra.setSymbol(sSymbol3);
schoolGL.add(gra);
calculatePop();
});
}
function executeSchool4() {
doPreEvents();
executeSchool4Evt = on(blocks, "click", function(e) {
gra = e.graphic.clone();
gra.attributes.SCHOOL = 4;
//gra.setSymbol(sSymbol4);
schoolGL.add(gra);
calculatePop();
});
}
function executeSchool5() {
doPreEvents();
executeSchool5Evt = on(blocks, "click", function(e) {
gra = e.graphic.clone();
gra.attributes.SCHOOL = 5;
//gra.setSymbol(sSymbol5);
schoolGL.add(gra);
calculatePop();
});
}
function calculatePop(id) {
var PopSumObj = {
1: 0,
2: 0,
3: 0,
4: 0,
5: 0
}
//summarize the ES Population to display
array.forEach(schoolGL.graphics, function(feature) {
switch (feature.attributes.SCHOOL) {
case 1:
PopSumObj[1] += feature.attributes.ES_Pop;
break;
case 2:
PopSumObj[2] += feature.attributes.ES_Pop;
break;
case 3:
PopSumObj[3] += feature.attributes.ES_Pop;
break;
case 4:
PopSumObj[4] += feature.attributes.ES_Pop;
break;
case 5:
PopSumObj[5] += feature.attributes.ES_Pop;
break;
}
});
var CapDiv, Capacity;
for (var i = 0; i < 5; i++) {
CapDiv = Math.round((PopSumObj[(i + 1)] / 900) * 100);
if (CapDiv >= 80 && CapDiv <= 99) {
Capacity = '<span style="color: green">' + CapDiv + "% - Good" + '</span>';
} else if (CapDiv >= 100) {
Capacity = '<span style="color: red">' + CapDiv + "% - High" + '</span>';
} else {
Capacity = '<span style="color: blue">' + CapDiv + "% - Low" + '</span>';
}
dom.byId('countResult_' + (i + 1)).innerHTML = PopSumObj[(i + 1)] + "(e) / 900(c) = " + "<b>" + Capacity + "</b>";
}
}
//add the legend
var legend = new Legend({
map: map,
layerInfos: [{
layer: blocks,
title: "School Re-Districting"
}]
}, "legendDiv");
legend.startup();
//function for refreshing block layer for use on button
var refreshlayer = new Button({
label: "Reset Map",
onClick: function() {
//the refresh will force it to get the original layer
schoolGL.clear();
dom.byId("countResult_1").innerHTML = "";
dom.byId("countResult_2").innerHTML = "";
dom.byId("countResult_3").innerHTML = "";
dom.byId("countResult_4").innerHTML = "";
dom.byId("countResult_5").innerHTML = "";
undoPreEvents();
}
}, "refreshbutton").startup();
//home button to return to map's default extent
var home = new HomeButton({
map: map
}, "HomeButton");
home.startup();
//Print Button
var printer = new Print({
map: map,
url: "http://gis.dekalb.k12.ga.us/arcgis_webadapter/rest/services/Redistricting/ExportWebMap_Test/GPServer/Export%20Web%20Map"
}, dom.byId("printButton"));
printer.startup();
on(printer, "onPrintComplete", function(result) {
var currentTime = new Date();
result.url += "?ts=" + currentTime.getTime();
});
// Code to edit the default print button text
printer._printText = 'Submit Map';
printer._printingText = 'Sending.., Please wait';
printer._printoutText = 'Map Submitted, Thank you.';
$(".esriPrintButton").children(".dijitButtonNode").children(".dijitButtonContents").children(".dijitButtonText").text('Submit Map');
on(printer, '_createPrintButton', function(value) {
$(".esriPrintButton").children(".dijitButtonNode").children(".dijitButtonContents").children(".dijitButtonText").text('Map Submitted, Thank you.');
});
});
</script>
</head>
<body class="tundra">
<div id="content" data-dojo-type="dijit/layout/BorderContainer" data-dojo-props="design:'headline', gutters:true" style="width: 100%; height: 100%; margin: 0;">
<div id="header" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'top'">Title Test1</div>
<div id="rightPane" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'right'">
<div data-dojo-type="dijit/layout/AccordionContainer">
<div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="title:'Title Test', selected:true">
<div id="info">
<button id="SchoolsButton1" data-dojo-type="dijit/form/Button">School 1</button><span class="stats" id="countResult_1"></span><br>
<button id="SchoolsButton2" data-dojo-type="dijit/form/Button">School 2</button><span class="stats" id="countResult_2"></span><br>
<button id="SchoolsButton3" data-dojo-type="dijit/form/Button">School 3</button><span class="stats" id="countResult_3"></span><br>
<button id="SchoolsButton4" data-dojo-type="dijit/form/Button">School 4</button><span class="stats" id="countResult_4"></span><br>
<button id="SchoolsButton5" data-dojo-type="dijit/form/Button">School 5</button><span class="stats" id="countResult_5"></span><br><br>
<div id="printButton" style="text-align: center; vertical-align: bottom;"></div>
<div id="refresh" style="text-align: center; vertical-align: bottom;"><button id="refreshbutton" type="button"></button></div>
</div>
<div id="legendDiv"></div>
</div>
</div>
</div>
<div id="mapDiv" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'center'" style="overflow:hidden;">
<div id="HomeButton"></div>
</div>
</div>
</body>
</html>
... View more
05-02-2018
10:39 AM
|
0
|
2
|
774
|
POST
|
Robert, This is a separate issue but it's using the above code. I added a print widget to the script but it does not export. The server error says Layer "graphicsLayer1": Field 'SCHOOL' not part of schema for this feature collection. Failed to execute (ExportWebMap). Is this a limitation of the print widget due to the graphics layer? Any workaround?
... View more
05-02-2018
09:50 AM
|
0
|
1
|
708
|
POST
|
Robert, Your method above works similarly to what I was trying to do. Thank you for the help!
... View more
04-30-2018
05:55 AM
|
0
|
0
|
708
|
POST
|
Understood, that was the intended workflow. do you have other suggestions to explore that would allow users to create different colored graphics and provided calculations based on the graphics?
... View more
04-26-2018
02:14 PM
|
0
|
4
|
708
|
POST
|
Robert, You can delete the css line, I was trying to clean up the file to only show the problem areas. As far as the process, the user clicks on school 1 button and starts to click on areas on the map. Each click will be highlighted in yellow while the calculation section updates next to the button. When the user clicks on school 2 button, it will start assigning another color and doing the separate calculation for that button. This will go on until the all 5 school buttons are completed.
... View more
04-26-2018
01:58 PM
|
0
|
6
|
708
|
POST
|
Hello, I'm trying to develop an app that will allow the users to make new areas using the several buttons to highlight and create areas on the map. Currently, the buttons can select individual areas but it does not separate from the individual buttons. The buttons keep adding on the selection while changing colors. I need help in figuring out how to separate the buttons so that it highlight the areas that they were clicked on and to make their query calculation display. <!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">
<title>Redistricting Test Map</title>
<link rel="stylesheet" href="https://js.arcgis.com/3.23/esri/css/esri.css">
<link rel="stylesheet" href="https://js.arcgis.com/3.23/dijit/themes/tundra/tundra.css">
<link rel="stylesheet" href="css/loader.css">
<style>
html,
body {
height: 100%;
margin: 0;
padding: 0;
}
#mapDiv {
padding: 1px;
border: solid 2px #444;
-moz-border-radius: 4px;
border-radius: 4px;
}
#HomeButton {
position: absolute;
top: 95px;
left: 21px;
z-index: 50;
}
#header {
border: solid 2px #462d44;
background: #fff;
color: #444;
-moz-border-radius: 4px;
border-radius: 4px;
font-size: 1.2em;
padding-left: 20px;
}
#rightPane {
width: 250px;
padding: 1px;
border: solid 2px #444;
-moz-border-radius: 4px;
border-radius: 4px;
}
#info {
font-weight: bold;
font-size: 0.85em;
}
</style>
<script src="https://js.arcgis.com/3.23/"></script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>
var map;
require([
"esri/map", "esri/layers/FeatureLayer", "esri/dijit/Print", "esri/InfoTemplate", "esri/toolbars/draw",
"esri/symbols/SimpleLineSymbol", "esri/symbols/SimpleFillSymbol", "esri/dijit/HomeButton", "esri/graphic",
"esri/renderers/SimpleRenderer", "esri/Color", "esri/config", "esri/dijit/Legend",
"esri/tasks/query", "esri/tasks/QueryTask", "dojo/_base/array", "dijit/registry", "dojo/query",
"esri/tasks/LegendLayer", "esri/tasks/StatisticDefinition", "esri/geometry/geometryEngine",
"dojo/store/Memory", "dojo/dom-construct", "dijit/form/Button", "dojo/dom", "dojo/on",
"dojo/parser", "dijit/layout/BorderContainer", "dijit/layout/ContentPane",
"dijit/layout/AccordionContainer", "dojo/domReady!"
], function(
Map, FeatureLayer, Print, InfoTemplate, Draw,
SimpleLineSymbol, SimpleFillSymbol, HomeButton, Graphic,
SimpleRenderer, Color, esriConfig, Legend,
Query, QueryTask, array, registry, dojoQuery,
LegendLayer, StatisticDefinition, geometryEngine,
Memory, domConstruct, Button, dom, on,
parser
) {
parser.parse();
esriConfig.defaults.io.proxyUrl = "/proxy/";
var selectionToolbar;
map = new Map("mapDiv", {
basemap: "topo",
center: [-84.20, 33.78], // lon, lat
zoom: 11
});
var defaultSymbol = new SimpleFillSymbol().setColor(new Color([255, 255, 255, 0.5]));
//defaultSymbol.outline.setStyle(SimpleLineSymbol.STYLE_NULL);
//create renderer
var renderer = new SimpleRenderer(defaultSymbol);
var content = "<b>ES Population</b>: ${ES_Pop}" +
"<br><b>MS Population</b>: ${MS_Pop}" +
"<br><b>HS Population</b>: ${HS_Pop}";
var infoTemplate = new InfoTemplate("${ES_Name}", content);
var fields = ["ES_Name", "ES_Pop", "MS_Pop", "HS_Pop"];
var blocks = new FeatureLayer("http://gis.dekalb.k12.ga.us/arcgis_webadapter/rest/services/Redistricting/ES_Areas_Redist_Test/FeatureServer/0", {
mode: FeatureLayer.MODE_SNAPSHOT,
//infoTemplate: infoTemplate,
outFields: fields
});
blocks.setRenderer(renderer);
map.addLayers([blocks]);
//map.on("load", initSelectToolbar);
var selectionSymbol1 = new SimpleFillSymbol().setColor(new Color([255, 255, 0, 0.5]));
var selectionSymbol2 = new SimpleFillSymbol().setColor(new Color([0, 255, 0, 0.5]));
var selectionSymbol3 = new SimpleFillSymbol().setColor(new Color([0, 0, 255, 0.5]));
var selectionSymbol4 = new SimpleFillSymbol().setColor(new Color([255, 0, 255, 0.5]));
var selectionSymbol5 = new SimpleFillSymbol().setColor(new Color([255, 0, 0, 0.5]));
dom.byId("SchoolsButton1").onclick = executeSchool1;
dom.byId("SchoolsButton2").onclick = executeSchool2;
dom.byId("SchoolsButton3").onclick = executeSchool3;
dom.byId("SchoolsButton4").onclick = executeSchool4;
dom.byId("SchoolsButton5").onclick = executeSchool5;
function executeSchool1() {
on(blocks, "click", function(e) {
var selectQuery = new Query();
blocks.setSelectionSymbol(selectionSymbol1);
selectQuery.objectIds = [e.graphic.attributes.OBJECTID];
if (e.shiftKey) {
blocks.selectFeatures(selectQuery, FeatureLayer.SELECTION_SUBTRACT, calculatePop1);
} else {
blocks.selectFeatures(selectQuery, FeatureLayer.SELECTION_ADD, calculatePop1);
}
});
}
function executeSchool2() {
on(blocks, "click", function(e) {
var selectQuery2 = new Query();
blocks.setSelectionSymbol(selectionSymbol2);
selectQuery2.objectIds = [e.graphic.attributes.OBJECTID];
if (e.shiftKey) {
blocks.selectFeatures(selectQuery2, FeatureLayer.SELECTION_SUBTRACT, calculatePop2);
} else {
blocks.selectFeatures(selectQuery2, FeatureLayer.SELECTION_ADD, calculatePop2);
}
});
}
function executeSchool3() {
on(blocks, "click", function(e) {
var selectQuery3 = new Query();
blocks.setSelectionSymbol(selectionSymbol3);
selectQuery3.objectIds = [e.graphic.attributes.OBJECTID];
if (e.shiftKey) {
blocks.selectFeatures(selectQuery3, FeatureLayer.SELECTION_SUBTRACT, calculatePop3);
} else {
blocks.selectFeatures(selectQuery3, FeatureLayer.SELECTION_ADD, calculatePop3);
}
});
}
function executeSchool4() {
on(blocks, "click", function(e) {
var selectQuery4 = new Query();
blocks.setSelectionSymbol(selectionSymbol4);
selectQuery4.objectIds = [e.graphic.attributes.OBJECTID];
if (e.shiftKey) {
blocks.selectFeatures(selectQuery4, FeatureLayer.SELECTION_SUBTRACT, calculatePop4);
} else {
blocks.selectFeatures(selectQuery4, FeatureLayer.SELECTION_ADD, calculatePop4);
}
});
}
function executeSchool5() {
on(blocks, "click", function(e) {
var selectQuery5 = new Query();
blocks.setSelectionSymbol(selectionSymbol5);
selectQuery5.objectIds = [e.graphic.attributes.OBJECTID];
if (e.shiftKey) {
blocks.selectFeatures(selectQuery5, FeatureLayer.SELECTION_SUBTRACT, calculatePop5);
} else {
blocks.selectFeatures(selectQuery5, FeatureLayer.SELECTION_ADD, calculatePop5);
}
});
}
function calculatePop1(event) {
var PopSum = 0;
//summarize the ES Population to display
array.forEach(event.features, function(feature) {
PopSum += feature.attributes.ES_Pop;
});
var CapDiv = Math.round((PopSum / 900) * 100);
var Capacity;
if (CapDiv >= 80 && CapDiv <= 99) {
Capacity = '<span style="color: green">' + CapDiv + "% - Good" + '</span>';
} else if (CapDiv >= 100) {
Capacity = '<span style="color: red">' + CapDiv + "% - High" + '</span>';
} else {
Capacity = '<span style="color: blue">' + CapDiv + "% - Low" + '</span>';
}
dom.byId("countResult_1").innerHTML = PopSum + "(e) / 900(c) = " + "<b>" + Capacity + "</b>";
}
function calculatePop2(event) {
var PopSum = 0;
//summarize the ES Population to display
array.forEach(event.features, function(feature) {
PopSum += feature.attributes.ES_Pop;
});
var CapDiv = Math.round((PopSum / 900) * 100);
var Capacity;
if (CapDiv >= 80 && CapDiv <= 99) {
Capacity = '<span style="color: green">' + CapDiv + "% - Good" + '</span>';
} else if (CapDiv >= 100) {
Capacity = '<span style="color: red">' + CapDiv + "% - High" + '</span>';
} else {
Capacity = '<span style="color: blue">' + CapDiv + "% - Low" + '</span>';
}
dom.byId("countResult_2").innerHTML = PopSum + "(e) / 900(c) = " + "<b>" + Capacity + "</b>";
}
function calculatePop3(event) {
var PopSum = 0;
//summarize the ES Population to display
array.forEach(event.features, function(feature) {
PopSum += feature.attributes.ES_Pop;
});
var CapDiv = Math.round((PopSum / 900) * 100);
var Capacity;
if (CapDiv >= 80 && CapDiv <= 99) {
Capacity = '<span style="color: green">' + CapDiv + "% - Good" + '</span>';
} else if (CapDiv >= 100) {
Capacity = '<span style="color: red">' + CapDiv + "% - High" + '</span>';
} else {
Capacity = '<span style="color: blue">' + CapDiv + "% - Low" + '</span>';
}
dom.byId("countResult_3").innerHTML = PopSum + "(e) / 900(c) = " + "<b>" + Capacity + "</b>";
}
function calculatePop4(event) {
var PopSum = 0;
//summarize the ES Population to display
array.forEach(event.features, function(feature) {
PopSum += feature.attributes.ES_Pop;
});
var CapDiv = Math.round((PopSum / 900) * 100);
var Capacity;
if (CapDiv >= 80 && CapDiv <= 99) {
Capacity = '<span style="color: green">' + CapDiv + "% - Good" + '</span>';
} else if (CapDiv >= 100) {
Capacity = '<span style="color: red">' + CapDiv + "% - High" + '</span>';
} else {
Capacity = '<span style="color: blue">' + CapDiv + "% - Low" + '</span>';
}
dom.byId("countResult_4").innerHTML = PopSum + "(e) / 900(c) = " + "<b>" + Capacity + "</b>";
}
function calculatePop5(event) {
var PopSum = 0;
//summarize the ES Population to display
array.forEach(event.features, function(feature) {
PopSum += feature.attributes.ES_Pop;
});
var CapDiv = Math.round((PopSum / 900) * 100);
var Capacity;
if (CapDiv >= 80 && CapDiv <= 99) {
Capacity = '<span style="color: green">' + CapDiv + "% - Good" + '</span>';
} else if (CapDiv >= 100) {
Capacity = '<span style="color: red">' + CapDiv + "% - High" + '</span>';
} else {
Capacity = '<span style="color: blue">' + CapDiv + "% - Low" + '</span>';
}
dom.byId("countResult_5").innerHTML = PopSum + "(e) / 900(c) = " + "<b>" + Capacity + "</b>";
}
//add the legend
var legend = new Legend({
map: map,
layerInfos: [{
layer: blocks,
title: ""
}]
}, "legendDiv");
legend.startup();
//function for refreshing block layer for use on button
var refreshlayer = new Button({
label: "Reset Map",
onClick: function() {
//the refresh will force it to get the original layer
blocks.clearSelection();
blocks.refresh();
dom.byId("countResult_1").innerHTML = "";
dom.byId("countResult_2").innerHTML = "";
dom.byId("countResult_3").innerHTML = "";
dom.byId("countResult_4").innerHTML = "";
dom.byId("countResult_5").innerHTML = "";
}
}, "refreshbutton").startup();
//home button to return to map's default extent
var home = new HomeButton({
map: map
}, "HomeButton");
home.startup();
});
</script>
</head>
<body class="tundra">
<div id="content" data-dojo-type="dijit/layout/BorderContainer" data-dojo-props="design:'headline', gutters:true" style="width: 100%; height: 100%; margin: 0;">
<div id="header" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'top'">Title Test1</div>
<div id="rightPane" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'right'">
<div data-dojo-type="dijit/layout/AccordionContainer">
<div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="title:'Title Test', selected:true">
<div id="info">
<button id="SchoolsButton1" data-dojo-type="dijit/form/Button">School 1</button><span class="stats" id="countResult_1"></span><br>
<button id="SchoolsButton2" data-dojo-type="dijit/form/Button">School 2</button><span class="stats" id="countResult_2"></span><br>
<button id="SchoolsButton3" data-dojo-type="dijit/form/Button">School 3</button><span class="stats" id="countResult_3"></span><br>
<button id="SchoolsButton4" data-dojo-type="dijit/form/Button">School 4</button><span class="stats" id="countResult_4"></span><br>
<button id="SchoolsButton5" data-dojo-type="dijit/form/Button">School 5</button><span class="stats" id="countResult_5"></span><br>
</div>
</div>
</div>
</div>
<div id="mapDiv" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'center'" style="overflow:hidden;">
<div id="HomeButton"></div>
</div>
</div>
</body>
</html>
... View more
04-26-2018
12:43 PM
|
0
|
8
|
845
|
POST
|
Update.. the original script was working correctly. I had to change my layer privileges to update so that the query would recognize the new updated attributes. I did not realize that the query function is called back to the server, i though it could query on the client-side. Is there a way to query on the client side instead back to the server so that I can reset the layer back to select only?
... View more
04-13-2018
06:31 AM
|
0
|
0
|
372
|
Title | Kudos | Posted |
---|---|---|
1 | 09-05-2018 08:48 AM |
Online Status |
Offline
|
Date Last Visited |
11-11-2020
02:24 AM
|