How to set SpatialReference on a Route Event in a Map Service in 3.18

LoriEmerson_McCormack · ‎10-11-2016

I have a map service with two route events: one with line features for the road, and one with a point for the start of the road. I set up custom InfoTemplates in my JavaScript which work. However, when I try to zoom-to the feature, the map zooms across the globe. I have other static features in the same map service and the zoom-to within the InfoTemplate works great.

I am using the topo basemap which is Web Mercator. All of my data within my map service in State Plane. I know within a query task and identify task, you can set the spatial reference to match the basemap. Do I need to define a Graphic with the SpatialReference and then assign the InfoTemplate?

Or, is there a better approach to get a popup with the information that zooms to the feature for a route event that is using a route layer in State Plane projection.

Here's the code after the require / function:

parser.parse();

//This sample may require a proxy page to handle communications with the ArcGIS Server services. You will need to

//replace the url below with the location of a proxy on your machine. See the 'Using the proxy page' help topic

//for details on setting up a proxy page.

esriConfig.defaults.io.proxyUrl = "/proxy/";

esriConfig.defaults.io.alwaysUseProxy = false;

var legendLayers = [];

var visible = [];

map = new Map("map", {

sliderOrientation: "vertical",

sliderPosition: "top-left",

basemap: "topo",

center: [-117.427677, 47.634390],

zoom: 10,

sliderStyle: "small"

}); //end map

//home button

var home = new HomeButton({

map: map

}, "HomeButton");

home.startup();

//*********************************************************************

// define popup info

//*********************************************************************

var _bridgeInfoContent = "<div class=\'bridgeInfoContent\'></div>";

var _bridgeInfoTemplate = new InfoTemplate();

_bridgeInfoTemplate.setTitle("<b>Bridge</b>");

_bridgeInfoTemplate.setContent("Bridge Number: <b>${BRIDGE_NO}</b><br>Bridge Name: <b>${bridge_name}</b><br>" +

"<br>${bridge_symbol:getRestriction}<br>" +

_bridgeInfoContent);

var _noTrucksInfoContent = "<div class=\'noTrucksInfoContent\'></div>";

var TrafficCodeURL = "https://www.municode.com/library/wa/spokane_county/codes/code_of_ordinances?nodeId=TIT46MOVE_CH46.44...";

var _noTrucksInfoTemplate = new InfoTemplate();

_noTrucksInfoTemplate.setTitle("<b>No Trucks Route</b>");

_noTrucksInfoTemplate.setContent("Road Name: <b>${RoadName}</b><br>Resolution: <b>${ResolutionNumber}</b><br>" +

"</br><a rel='external' target=_blank' href='" + TrafficCodeURL + "'>County Code</a>" +

_noTrucksInfoContent);

var _travelImpactRoadInfoContent = "<div class=\'travelImpactRoadInfoContent\'></div>";

var _travelImpactRoadInfoTemplate = new InfoTemplate();

_travelImpactRoadInfoTemplate.setTitle("<b>Road Traffic Impact</b>");

_travelImpactRoadInfoTemplate.setContent("<b><u>${TravelImpactCategory}</b> on <b>${RoadName}</u></b>" +

"</br>from<b> " + "${BeginDescr:getRoadDescription}" +

"</br></b>to<b> " + "${EndDescr:getRoadDescription}</b>" +

"</br></br><b><u>${TravelImpact}</u></b>" +

"</br>${TravelImpactDetail}</br><b>${TravelImpactStartDate:DateFormat(datePattern:'MM/dd/yyyy', selector:'date')} - " +

"${TravelImpactEndDate:DateFormat(datePattern:'MM/dd/yyyy', selector:'date')}</b>" +

"<br>${LanesAffected}, ${LaneDirection}" +

"</br><br><b><u>${ProjectName}</u></b></br>${ProjectDescription}" +

"</br><b>${ProjectStartDate:DateFormat(datePattern:'MM/dd/yyyy', selector:'date')} - " +

"${ProjectEndDate: DateFormat(datePattern:'MM/dd/yyyy', selector:'date')}</b>" +

"${ProjectURL:getURL}" +

"</br></br><b>Contact: </b>${ContactName}. ${ContactPhone}" +

_travelImpactRoadInfoContent);

//*********************************************************************

// map layers from published map service

//*********************************************************************

var bridgesIndex = 0;

var travelImpactSiteIndex = 1;

var travelImpactRouteIndex = 2;

//var restrCurrIndex = 4;

//var restrFutIndex = 5;

var noTrucksIndex = 3;

var cntyBdryURLIndex = 4;

//*********************************************

//open/close the accordion when the menu button is clicked

//*********************************************

$("#btnMenu").click(function () {

$("#AccordionPane").toggle();

});

var allTravelImpactsLayerURL = "http://gis.spokanecounty.org/arcgis/rest/services/Engineering/TravelImpactsDev/MapServer";

//allTravelImpactsLayerOptions.setInfo = {

// layerInfos: [0, 1, 2, 3]

//};

var allTravelImpactsLayer = new ArcGISDynamicMapServiceLayer(allTravelImpactsLayerURL);

allTravelImpactsLayer.setInfoTemplates({

0: { infoTemplate: _bridgeInfoTemplate },

2: { infoTemplate: _travelImpactRoadInfoTemplate },

3: { infoTemplate: _noTrucksInfoTemplate }

});

allTravelImpactsLayer.setVisibleLayers([bridgesIndex, travelImpactSiteIndex, travelImpactRouteIndex, noTrucksIndex]);

allTravelImpactsLayer.on("load", buildLayerList);

legendLayers.push({ layer: allTravelImpactsLayer, title: 'MyStuff' });

map.addLayer(allTravelImpactsLayer);

function buildLayerList() {

var items = arrayUtils.map(allTravelImpactsLayer.layerInfos, function (info, index) {

if (info.defaultVisibility) {

visible.push(info.id);

}

return "<input type='checkbox' class='list_item'" + (info.defaultVisibility ? "checked=checked" : "") + "'id='" + info.id + "'' /><label for='" + info.id + "'>" + info.name + "</label></br>";

});

var ll = dom.byId("layerListDiv");

ll.innerHTML = items.join(' ');

allTravelImpactsLayer.setVisibleLayers(visible);

on(ll, "click", updateLayerVisibility);

var legendDijit = new Legend({

map: map,

layerInfos: legendLayers

}, "legendDiv");

legendDijit.startup();

//legendDijit.refresh();

}

function updateLayerVisibility() {

var inputs = query(".list_item");

var input;

visible = [];

arrayUtils.forEach(inputs, function(input) {

if (input.checked) {

visible.push(input.id);

}

});

//if there aren't any layers visible set the array to be -1

if (visible.length === 0) {

visible.push(-1);

}

allTravelImpactsLayer.setVisibleLayers(visible);

}

}); //end require/function

}); //end of $(document).ready(

var getRestriction = function (value, key, data) {

if (value == "weight restr") {

return "<b><u>Load Limits:</u></b><br>3 axles: " + data.weight_restriction_3axle + " tons" +

"<br>5 axles: " + data.weight_restriction_5axle + " tons" +

"<br>6 axles: " + data.weight_restriction_6axle + " tons"

;

} else {

var minvertunder = (data.min_vert_under).toString();

var bridgeft = minvertunder.slice(0, 2);

var bridgein = minvertunder.slice(2, 4);

return "<b><u>Height Restriction:</u></b></br>Minimum Vertical Clearance: <b>" + bridgeft + " ft " + bridgein + " in</b>";

}

};

var getDescription = function (value, key, data) {

desc1 = value.split(":at ");

desc2 = bdesc1[1].split("@");

return desc2;

};

var getURL = function (value, key, data) {

if (value.length == 0) {

return " ";

}

else {

return "</br><a rel='external' target=_blank' href='" + value + "'>Project Details</a>"

}

};

</script>

</head >

<body >

</button>

<span id="spanHeader">Travel Impacts</span>

</div>

<a class="accordion-section-title" href="#accordion-1">Legend</a>

</div>

</div>

<a class="accordion-section-title" href="#accordion-2">Layer List</a>

</div>

</div>

</div>

</div>

</div >

</body >

</html >

RobertScheitlin__GISP · ‎10-13-2016

Lori,

If the layer id is not changed then the link I provided in my previous reply should work.

LoriEmerson_McCormack · ‎10-24-2016

Re-publishing the map service worked. I am unable to personally publish the map service (our IT group does). To get the route event to work properly, the Authentication Type on the Database Connection to the Route GIS feature class had to be changed; It was changed from "Operating system authentication" to "Database authentication".

In my JavaScript, I used the IdentifyTask (instead of the InfoWindow templates), which allows for setting the SpatialReference:

function executeIdentifyTask(event) {

var outSR = new SpatialReference(4326);

identifyParams.geometry = event.mapPoint;

identifyParams.mapExtent = map.extent;

...etc.