<!DOCTYPE html><html> <head> <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no" /> <meta name="apple-mobile-web-app-capable" content="yes" /> <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"> <title> Campus Utilities </title> <!-- <link href="https://community.esri.com//ajax.googleapis.com/ajax/libs/dojo/1.9.1/dojox/mobile/themes/iphone/iphone.css" rel="stylesheet"></link>--> <link rel="stylesheet" href="http://jsdev.arcgis.com/3.7/js/esri/css/esri.css"> <link rel="stylesheet" type='text/css' href='http://serverapi.arcgisonline.com/jsapi/arcgis/2.4/js/esri/dijit/css/Popup.css' /> <link rel="stylesheet" type='text/css' href='http://serverapi.arcgisonline.com/jsapi/arcgis/2.4/js/esri/dijit/css/PopupMobile.css' /> <!-- css used to customize the UI of the application --> <link rel="stylesheet" href="css/main.css" /> <!-- stylesheet will go here --> <!-- dojo/javascript will go here --> <!--not sure if i need this??--> <script> var dojoConfig = { mblAlwaysHideAddressBar: true }; </script> <script type="text/javascript" src="dojox/mobile/deviceTheme.js" data-dojo-config="mblThemeFiles: ['base','Accordion']" , data-dojo-config="async:true"> </script> <script src="http://jsdev.arcgis.com/3.7compact/"> </script> <script> // Load the widget parser and mobile base require(["dojox/mobile/parser", "dojox/mobile/deviceTheme", "dojox/mobile", "dojox/mobile/View", "dojox/mobile/ContentPane", "esri/InfoTemplate", "esri/map", "esri/dijit/PopupMobile", "esri/dijit/PopupTemplate", "esri/layers/FeatureLayer", "esri/sniff", "dojox/mobile/ToolBarButton", "dojo/on", "esri/layers/FeatureLayer", "esri/dijit/Legend", "dojo/domReady!"], function(parser, deviceTheme, on, Map, dom, registry, mobile, has, PopupMobile, PopupTemplate, FeatureLayer, InfoTemplate) { // Parse the page for widgets! parser.parse(); var popup = new esri.dijit.PopupMobile(null, dojo.create("div")); var map = new esri.Map("map", { basemap: "satellite", center: [-98.57, 39.82], zoom: 4, slider: false, extent: initExtent, infoWindow: popup, isPan: true }); dojo.place(popup.domNode, map.root); var IrrigationLines = new esri.layers.FeatureLayer("http://sampleserver6.arcgisonline.com/arcgis/rest/services/Census/MapServer/3", { mode: esri.layers.FeatureLayer.MODE_ONDEMAND, infoTemplate: popupTemplate, outFields: ["*"] }); //define a popup template var popupTemplate = new esri.InfoTemplate({ title: "{STATE_NAME}", fieldInfos: [{ fieldName: "SUB_REGION", label: 'SUB_REGION ', visible: true }], showAttachments: false }); IrrigationLines.on("click", function(evt) { map.infoWindow.setFeatures([evt.graphic]); map.infoWindow.show(evt.mapPoint); }) map.addLayers([IrrigationLines]); }); </script> </head> <body> <!-- application will go here --> <div id="mapView" data-dojo-type="dojox.mobile.View" data-dojo-props="selected: true"> <div id="header" data-dojo-type="dojox.mobile.Heading"> <div id="aboutButton" data-dojo-type="dojox.mobile.ToolBarButton" style="float: right;" moveTo="aboutView"> About </div> <div id="legendButton" data-dojo-type="dojox.mobile.ToolBarButton" style="float: right;" moveTo="legendView"> Legend </div> </div> <div id="mapContainer" data-dojo-type="dojox.mobile.ContentPane"> <div id="map"> </div> </div> </div> <div id="aboutView" data-dojo-type="dojox.mobile.View"> <h1 data-dojo-type="dojox.mobile.Heading" data-dojo-props="back:'Map', moveTo:'mapView'"> About </h1> <p style="padding: 5px;"> Community College District </p> <div id="testtext"> </div> <p> Web mapping application of campus utilities and infrastructure. </p> </div> <div id="legendView" data-dojo-type="dojox.mobile.View"> <h1 data-dojo-type="dojox.mobile.Heading" data-dojo-props="back:'Map', moveTo:'mapView'"> Legend </h1> <div data-dojo-type="dojox.mobile.ContentPane" id="legendPane" data-dojo-props="title:'Legend', selected:true"> <div id="legendDiv"> </div> </div> </div> </body> </html>
Solved! Go to Solution.
var popupTemplate = new esri.InfoTemplate("${STATE_NAME}", "${SUB_REGION}"); var IrrigationLines = new esri.layers.FeatureLayer("http://sampleserver6.arcgisonline.com/arcgis/rest/services/Census/MapServer/3", { mode: esri.layers.FeatureLayer.MODE_ONDEMAND, infoTemplate: popupTemplate, outFields: ["*"] });
var popupTemplate = new esri.InfoTemplate("${STATE_NAME}", "${SUB_REGION}"); var IrrigationLines = new esri.layers.FeatureLayer("http://sampleserver6.arcgisonline.com/arcgis/rest/services/Census/MapServer/3", { mode: esri.layers.FeatureLayer.MODE_ONDEMAND, infoTemplate: popupTemplate, outFields: ["*"] });