<%--<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="population.aspx.cs" Inherits="WebApplication3._Default" %>--%>
<!DOCTYPEhtml>
<html>
<head>
<metahttp-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-->
<metaname="viewport"content="initial-scale=1, maximum-scale=1,user-scalable=no">
<title>Nalgonda point data popup</title>
<linkrel="stylesheet"href="http://js.arcgis.com/3.13/dijit/themes/claro/claro.css">
<linkrel="stylesheet"href="http://js.arcgis.com/3.13/esri/css/esri.css">
<style>
html, body,
#map
.map.container {
padding: 0;
margin: 0;
height:50%;
}
#info {
top: 2px;
color: #444;
height: auto;
font-family: arial;
font-weight: bold;
left: 69px;
margin: 5px;
padding: 10px;
position: absolute;
width: 260px;
z-index: 40;
border: solid 1px #003300;
border-radius: 4px;
background-color: Green;
}
/* Change color of icons to match bar chart and selection symbol */
.esriPopup.darkdiv.titleButton,
.esriPopup.darkdiv.titlePane.title,
.esriPopup.darkdiv.actionsPane.action {
color: #A4CE67;
}
/* Additional customizations */
.esriPopup.dark.esriPopupWrapper {
border: none;
}
.esriPopup.contentPane {
text-align: center;
}
.esriViewPopup.gallery {
margin:0auto;
}
</style>
<script src="http://js.arcgis.com/3.13/"></script>
<script>
var map;
require([
"esri/map",
"esri/dijit/Popup", "esri/dijit/PopupTemplate",
"esri/layers/FeatureLayer",
"esri/symbols/SimpleFillSymbol", "esri/Color",
"dojo/dom-class", "dojo/dom-construct", "dojo/on",
"dojox/charting/Chart", "dojox/charting/themes/Dollar", "dojo/parser",
"dijit/layout/BorderContainer", "dijit/layout/ContentPane", "dijit/TitlePane",
"dojo/domReady!"
], function (
Map,
Popup, PopupTemplate,
FeatureLayer, SimpleFillSymbol, Color, BasemapGallery, arcgisUtils,
domClass, domConstruct, on,
Chart, Dollar, parser) {
parser.parse();
map = new Map("map", {
basemap: "topo",
center: [78.8718, 21.7679],
zoom: 4
});
// ) {
//add the basemap gallery, in this case we'll display maps from ArcGIS.com including bing maps
var basemapGallery = new BasemapGallery({
showArcGISBasemaps: true,
map: map
}, "basemapGallery");
basemapGallery.startup();
basemapGallery.on("error", function (msg) {
console.log("basemap gallery error: ", msg);
});
// ) {
//The popup is the default info window so you only need to create the popup and
//assign it to the map if you want to change default properties. Here we are
//noting that the specified title content should display in the header bar
//and providing our own selection symbol for polygons.
var fill = new SimpleFillSymbol("solid", null, new Color("#A4CE67"));
var popup = new Popup({
fillSymbol: fill,
titleInBody: false
}, domConstruct.create("div"));
//Add the dark theme which is customized further in the <style> tag at the top of this page
domClass.add(popup.domNode, "dark");
map.infoWindow = popup;
// map = new Map("map", {
// basemap: "gray",
// center: [78.8718, 21.7679],
// zoom: 4,
// infoWindow: popup
// });
var template = new PopupTemplate({
title: "munugode subdivision",
description: "{village}: {population} are affected",
fieldInfos: [{ //define field infos so we can specify an alias
fieldName: "Number_Ent",
label: "Entrants"
}, {
fieldName: "Number_Sta",
label: "Starters"
}, {
fieldName: "Number_Fin",
label: "Finishers"
}],
mediaInfos: [{ //define the bar chart
caption: "",
type: "barchart",
value: {
theme: "Dollar",
fields: ["Number_Ent", "Number_Sta", "Number_Fin"]
}
}]
});
var featureLayer = new FeatureLayer("http://3092-ggngis:6080/arcgis/rest/services/BSESWithoutOwnership/FeatureServer/0", {
mode: FeatureLayer.MODE_ONDEMAND,
outFields: ["*"],
infoTemplate: template
});
map.addLayer(featureLayer);
});
</script>
</head>
<body class="claro">
<div data-dojo-type="dijit/layout/BorderContainer"
data-dojo-props="design:'headline', gutters:false"
style="width:75%;height:75%;margin:0;">
<div id="map"
data-dojo-type="dijit/layout/ContentPane"
data-dojo-props="region:'center'"
style="padding:0;">
<div style="position:absolute; right:20px; top:10px; z-Index:999;">
<div data-dojo-type="dijit/TitlePane"
data-dojo-props="title:'Switch Basemap', closable:false, open:false">
<div data-dojo-type="dijit/layout/ContentPane"style="width:100; height:100px; overflow:auto;">
<divid="basemapGallery"></div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
