Hello OpenLayers Gurus,<br>While learning mapping technologies and having fun, I rendered a galactic map of the MMORPG Eve-Online galaxy. It's loaded into OpenLayers, and I've added a marker and Popup OK. Awesome.<br>
<br>Examples:<br><a href="http://i223.photobucket.com/albums/dd209/ultrus/Picture2-1.png">http://i223.photobucket.com/albums/dd209/ultrus/Picture2-1.png</a><br><a href="http://i223.photobucket.com/albums/dd209/ultrus/Picture1-2.png">http://i223.photobucket.com/albums/dd209/ultrus/Picture1-2.png</a><br>
<br>Now there's some challenges I'm hoping to get some general feedback on. In general, how would you handle the following (code at bottom for reference):<br><br>Bigger popups on click:<br>Right now I use marker+popup combo to create a text based marker to show who is where, and what their shared status is (gray, blue, green, yellow, orange, red). it looks OK, but I'd like to show a different popup that gives detailed info when clicked. Current plan is to link the text in the little popup to call a function that hides itself and shows a bigger one with detailed info. Sound good?<br>
<br>adding/editing/updating/deleting tons of markers/popups:<br>I'm tracking a lot of pilots in a fleet in real time as they move from place to place. What's the best way to track/edit markers/popups in this scenerio? I'm thinking about keeping a master array or object, referencing everything there. Any suggestions on where to start?<br>
<br>Overlapping markers:<br>Often times, several pilots will be in the same place. Eww. This is probably a common mapping issue, and I've seen it happen a lot with real estate websites when many homes are in the same town. Should I just let it go as long as I have a sidebar listing everyone? Current thoughts are to show the pilot with the most urgent color/status on top somehow. What do you think?<br>
<br>The goal of this project is to LEARN OpenLayers in a low pressure way, and help buddies find each other in the massive virtual galaxy (using the in-game Chromium based web browser that connects to game data - like where you are). <br>
<br>Thanks much for your advise in advance.<br><br>Chris<br><br>==== code (slightly simplified) ====<br><br><html xmlns="<a href="http://www.w3.org/1999/xhtml">http://www.w3.org/1999/xhtml</a>"><br> <head><br>
<style type="text/css"><br>img {<br> border: 0px;<br>} <br>.olPopup {<br> padding: 0px;<br> background: none;<br> font-family: Verdana, Arial, Helvetica, sans-serif;<br> font-size: 9px;<br>
color: #FFFFFF;<br> margin-left: 0px;<br> margin-top: -35px;<br> border: #FF9900 solid 1px;<br>}<br><br>.statBlue {<br> background: #00264C;<br> padding: 0px 2px 2px 2px;<br> border: #33FFFF solid 2px;<br>
}<br><br></style><br><script src="./js/OpenLayers-2.8/lib/OpenLayers.js"></script><br><script src="./js/LabelMaker.js"></script><br><script type="text/javascript"><br>
var map, layer;<br><br>function init(){<br> OpenLayers.ImgPath = "./images/light/";<br> map = new OpenLayers.Map( $('map'), {<br> resolutions: [0.703125, 0.3515625, 0.17578125, 0.087890625, <br>
0.0439453125, 0.02197265625, 0.010986328125, <br> 0.0054931640625, 0.00274658203125, 0.001373291015625]<br> });<br> layer = new OpenLayers.Layer.TileCache("EVE: System Security",<br>
["./maps"],<br> "evedot4",<br> {<br> serverResolutions: [0.703125, 0.3515625, 0.17578125, 0.087890625, <br> 0.0439453125, 0.02197265625, 0.010986328125, <br>
0.0054931640625, 0.00274658203125, 0.001373291015625, <br> 0.0006866455078125, 0.00034332275390625, 0.000171661376953125, <br> 0.0000858306884765625, 0.00004291534423828125, 0.000021457672119140625]<br>
}<br> );<br> map.addLayer(layer);<br> map.setCenter(new OpenLayers.LonLat(0, 0), 2);<br> map.addControl(new OpenLayers.Control.LayerSwitcher({'ascending':false}));<br> <br> var markers = new OpenLayers.Layer.Markers( "My Location" );<br>
map.addLayer(markers);<br> <br> var size = new OpenLayers.Size(56,22);<br> var offset = new OpenLayers.Pixel(-2, -21);<br> var icon = new OpenLayers.Icon('./images/markers/statBlue3.png',size,offset);<br>
markers.addMarker(new OpenLayers.Marker(new OpenLayers.LonLat(-10.3300968263,2.98563041298),icon));<br> <br> popup = new OpenLayers.Popup("testPopup",<br> new OpenLayers.LonLat(-10.3300968263,2.98563041298),<br>
new OpenLayers.Size(100,12),<br> '<span class="statBlue">Ultran</span>',<br> false); <br> popup.backgroundColor = 'none';<br> popup.padding = '0';<br>
map.addPopup(popup);<br> <br>}<br><br>OpenLayers.Util.onImageLoadError = function() { <br> this.src = "./images/blank.gif";<br> this.style.display = "";<br>};<br></script><br> </head><br>
<body onLoad="init()"><br> <div id="map"></div><br> </body><br></html><br><br>