Dear all,
Here I am very much forced to change silverlight API to javascript API in our web application. I am very new in Java and just trying to develop the web application in javascript. I need to write all coding in vb.net except map display. For that I wrote the code below.
Here init() function calling from page load.My problem is when I am trying to add some graphics it is giving me error "map is undefined".
How can I solve that?Please note If I will call addgraphics function from input button click then it is not showing any error
1.Is it possible to add graphic from code behind using vb.net?If S how can I access map variable from code behind
Protected Sub Page_LoadComplete(sender As Object, e As EventArgs) Handles Me.LoadComplete
ScriptManager.RegisterStartupScript(Me, Me.GetType(), "init", "init();", True)
End Sub
2.
<title>Google Maps Layer in ArcGIS JS API</title>
<link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/2.1/js/dojo/dijit/themes/claro/claro.css"/>
<style>
html, body, #mapDiv{
padding: 0;
margin: 0;
height: 100%;
z-index: -1;
}
.auto-style1 {
}
.auto-style2 {
height: 20px;
}
.auto-style3 {
height: 20px;
}
.auto-style4 {
text-align: left;
}
.auto-style5 {
width: 137px;
}
.auto-style6 {
height: 2%;
width: 279px;
}
.auto-style7 {
width: 279px;
}
#TxtAltareeqEng {
width: 55px;
}
#TxtAltareeqEng0 {
width: 55px;
}
</style>
<script type="text/javascript">
var djConfig = {
parseOnLoad: true,
baseUrl: './',
modulePaths: {
// if use local copy, make sure the path reference is relative to 'baseUrl', e.g.:
//'agsjs': '../build/agsjs'
// use absolute path for online version. Note sometimes googlecode.com can be slow.
'agsjs': 'http://gmaps-utility-gis.googlecode.com/svn/tags/agsjs/1.05/build/agsjs'
}
};
</script>
<script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=2.4">
</script>
<script type="text/javascript">
dojo.require("esri.map");
dojo.require("dijit.form.Button");
dojo.require("dijit.layout.BorderContainer");
dojo.require("dijit.layout.ContentPane");
dojo.require("agsjs.layers.GoogleMapsLayer");
dojo.require("esri.layers.graphics");
var map;
var streetMap, esriTopo, gMap;
var AltareeqArb, AltareeqEng;
function init() {
var initExtent = new esri.geometry.Extent({
"xmin": -14628212,
"ymin": 714227,
"xmax": 7718305,
"ymax": 9832858,
"spatialReference": {
"wkid": 102100
}
});
map = new esri.Map("mapDiv", {
extent: initExtent,
logo: true
});
AltareeqEng = document.getElementById('TxtAltareeqEng').value;
AltareeqArb = document.getElementById('TxtAltareeqArb').value;
AltareeqEng = "http://sampleserver6.arcgisonline.com/arcgis/rest/services/Census/MapServer";
AltareeqArb = "http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Petroleum/KGS_OilGasFields_Kansas/MapServ...";
streetMap = new esri.layers.ArcGISDynamicMapServiceLayer(AltareeqEng, {
id: "streetMap"
});
map.addLayer(streetMap);
esriTopo = initLayer(AltareeqArb, "esriTopo");
gMap = new agsjs.layers.GoogleMapsLayer({
id: 'googlemaps',
visible: false,
});
map.addLayer(gMap);
//resize the map when the browser resizes - view the 'Resizing and repositioning the map' section in
//the following help topic for more details http://help.esri.com/EN/webapi/javascript/arcgis/help/jshelp_start.htm#jshelp/inside_guidelines.htm
var resizeTimer;
dojo.connect(map, 'onLoad', function (theMap) {
dojo.connect(dijit.byId('map'), 'resize', function () { //resize the map if the div is resized
clearTimeout(resizeTimer);
resizeTimer = setTimeout(function () {
map.resize();
map.reposition();
}, 500);
});
});
}
function addgraphic() {
var infoTemplate = new esri.InfoTemplate();
var symbol = new esri.symbol.SimpleMarkerSymbol();
symbol.setColor(new dojo.Color([0, 0, 255]));
var cityLayer = new esri.layers.GraphicsLayer();
map.addLayer(cityLayer);
var geomPoint = new esri.geometry.Point(2022981.06, 13591805.53, new esri.SpatialReference({ wkid: 2278 }));
var pointGraphic = new esri.Graphic(geomPoint, symbol);
infoTemplate.content = 'dfdsfs'
pointGraphic.setInfoTemplate(infoTemplate);
cityLayer.add(pointGraphic);
}
function initLayer(url, id) {
var layer = new esri.layers.ArcGISDynamicMapServiceLayer(url, {
id: id,
visible: false
});
map.addLayer(layer);
return layer;
}
function changeMap(layers) {
hideImageTiledLayers(layers);
for (var i = 0; i < layers.length; i++) {
layers.show();
}
}
function hideImageTiledLayers(layers) {
for (var j = 0, jl = map.layerIds.length; j < jl; j++) {
var layer = map.getLayer(map.layerIds);
if (dojo.indexOf(layers, layer) == -1) {
layer.hide();
}
}
}
</script>