POST
|
Hi Guys again, for this fiddle http://jsfiddle.net/Zp5qc/ I want to info window to span on click so that it shows all of it on click. I have the code below with used to work but, now I don't have access to the event object. Well, regardless; the general case is how to span an infoWindow after a marker it clicked so that is shows all the infoWindow. Thank For the map above [HTML] dojo.connect(markerLayer, "onClick", addPoint); function addPoint(evt) { map.infoWindow.setTitle(title); map.infoWindow.resize(230,130); map.infoWindow.setContent(popup_content); map.graphics.clear(); //Set the infoWindow to open at the top right of the point at all times map.infoWindow.setFixedAnchor(esri.dijit.InfoWindow.ANCHOR_UPPERRIGHT); //Determine the upper right, and center, coordinates of the map var maxPoint = new esri.geometry.Point(map.extent.xmax, map.extent.ymax) var centerPoint = new esri.geometry.Point(map.extent.getCenter()); //Convert these to screen coordinates var maxPointScreen = map.toScreen(maxPoint); var centerPointScreen = map.toScreen(centerPoint); //Subtract the size of the infoWindow, including a buffer. //This will show whether the infoWindow would spill out of the current view. var xDiff = Math.abs(maxPointScreen.x - evt.screenPoint.x) - 270; var yDiff = Math.abs(maxPointScreen.y - evt.screenPoint.y) - 185; //If required, recalculate a new centerpoint which accounts for the infoWindow if (xDiff < 0) {centerPointScreen.x -= xDiff;} if (yDiff < 0) {centerPointScreen.y += yDiff;} //Pan the map to the new centerpoint (in Map coordinates) centerPoint = map.toMap(centerPointScreen); map.centerAt(centerPoint); //Display the infoWindow at the original point clicked map.infoWindow.show(evt.screenPoint, esri.dijit.InfoWindow.ANCHOR_UPPERRIGHT); } [/HTML]
... View more
05-30-2012
09:27 AM
|
0
|
0
|
299
|
POST
|
Hi Everybody, I want to accomplish something seemingly simple, however I have failed on all my attempt. Some help please I want a map with two layers: Street map and World imagery (satellite view) with the ability to toggle between views. Further, I want to be able to add markers that will remain in place on toggle. [HTML] <script type="text/javascript">var djConfig = {parseOnLoad: true};</script> <script type="text/javascript"> function draw_map(lon, lat,title, date, address, description) { dojo.require("dijit.dijit"); dojo.require("dijit.layout.BorderContainer"); dojo.require("dijit.layout.ContentPane"); dojo.require("esri.map"); dojo.require("esri.dijit.BasemapGallery"); dojo.require("dijit.Tooltip"); dojo.require("dijit.form.Button"); dojo.require("dijit.Menu"); var map, basemapGallery; function init() { var initExtent = new esri.geometry.Extent({"xmin":-117.18,"ymin":34.03,"xmax":-117.16,"ymax":34.04,"spatialReference":{"wkid":4326}}); map = new esri.Map("map",{ extent:esri.geometry.geographicToWebMercator(initExtent) }); createBasemapGallery(); dojo.connect(map,'onLoad', function(map) { // map.centerAt(geometry); // map.centerAndZoom(geometry,12); }); } function createBasemapGallery(){ //Manually create a list of basemaps to display var basemaps = []; var streetMap = new esri.dijit.Basemap({ layers: [new esri.dijit.BasemapLayer({ url: "http://server.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer" })], id: "StreetMap", title: "Street Map View" }); basemaps.push(streetMap); var satelliteMap = new esri.dijit.Basemap({ layers: [new esri.dijit.BasemapLayer({ url: "http://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer" })], id: "Satellite", title: "Satellite View" }); basemaps.push(satelliteMap); basemapGallery = new esri.dijit.BasemapGallery({ showArcGISBasemaps: false, basemaps: basemaps, map: map }); //BasemapGallery.startup isn't needed because we aren't using the default basemap, instead //we are going to create a custom user interface to display the basemaps, in this case a menu. dojo.forEach(basemapGallery.basemaps, function(basemap) { //Add a menu item for each basemap, when the menu items are selected dijit.byId("bingMenu").addChild(new dijit.MenuItem({ label: basemap.title, onClick: dojo.hitch(this, function() { this.basemapGallery.select(basemap.id); var map = this.basemapGallery.get(basemap.id); var markerLayer = new esri.layers.GraphicsLayer({ id:'cc-maps-gl' }); map.addLayer(markerLayer); var markerSymbol = new esri.symbol.PictureMarkerSymbol("/sites/all/themes/charmander/images/pin.png", 24, 38); var font = new esri.symbol.Font({ family:'"Lucida Grande","Lucida Sans","Lucida Sans Unicode",helvetica,arial,sans-serif', size:'13px', weight:esri.symbol.Font.WEIGHT_BOLD, }); var marker = {}; marker.longitude = '-118.134618'; marker.latitude = '33.832876'; marker.letter = 'A'; var geometry = esri.geometry.geographicToWebMercator(new esri.geometry.Point(marker.longitude, marker.latitude)); markerLayer.add(new esri.Graphic(geometry, markerSymbol)); var textSymbol = new esri.symbol.TextSymbol(marker.letter); textSymbol.setFont(font); markerLayer.add(new esri.Graphic(geometry, textSymbol)); }) })); }); } dojo.addOnLoad(init); } </script> <style> table.dijit tr { background: transparent !important; } </style> <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"/> <title>Display Multiple ArcGIS Online Services</title> <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/2.8/js/dojo/dijit/themes/claro/claro.css"> <style> html, body { height: 100%; width: 100%; margin: 0; padding: 0; } #map{padding:0;} </style> <script type="text/javascript">var djConfig = {parseOnLoad: true};</script> <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/2.8/js/dojo/dijit/themes/claro/claro.css"> <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=2.8"></script> <script type="text/javascript"> draw_map("-149.882219", "61.187024", "Help Animals Recurring (Singel Occurance Opportunity)", "Mon, May 28, 2012", "8800 Venice Blvd., Anchorage, AK 99599", "Causecast"); </script> <div dojotype="dijit.layout.BorderContainer" design="headline" gutters="false" style="width: 300px; height: 300px;"> <div id="map" class="claro" dojotype="dijit.layout.ContentPane" region="center"> <div style="position:absolute; right:50px; top:10px; z-Index:99;"> <button id="dropdownButton" iconClass="bingIcon" label="Views" dojoType="dijit.form.DropDownButton"> <div dojoType="dijit.Menu" id="bingMenu"> <!--The menu items are dynamically created using the basemap gallery layers--> </div> </button> </div> </div> </div> [/HTML]
... View more
05-25-2012
02:12 PM
|
0
|
3
|
1160
|
Online Status |
Offline
|
Date Last Visited |
11-11-2020
02:23 AM
|