Here's some JavaScript that will get you started. I have quickly taken it apart from an application i've developed. It may or may not work for you but it will give you a good place to start.
Be sure to checkout the OpenLayers Documentation.
Cheers
Paul D.
/*
function onInitialize - Fusion.Event Handler
*/
function onInitialize() {
var map = Fusion.getMapById('mapArea');
map.registerForEvent(Fusion.Event.MAP_SELECTION_ON, selectionOn);
map.registerForEvent(Fusion.Event.MAP_LOADED, mapIsLoaded);
}
/*
function selectionOn - Selection activated
*/
function selectionOn() {
var mapWidget = Fusion.getMapById('mapArea');
var maps = mapWidget.getAllMaps();
var map = maps[0];
// get the selection and trigger selectionLoaded with the obj
map.getSelection(selectionLoaded.bind(null));
}
/*
function selectionLoaded - Selection loaded
*/
function selectionLoaded(obj){
// set defaults for the cloud popup
var AutoSizeFramedCloud = OpenLayers.Class(OpenLayers.Popup.FramedCloud, {
'autoSize': true,
'minSize': new OpenLayers.Size(300,300),
'fixedRelativePosition':true,
'relativePosition':'tr'
});
lonLat = new OpenLayers.LonLat(obj.fMaxX,obj.fMaxY);
// add the marker
addMarkerPopup(lonLat, AutoSizeFramedCloud, obj, true,true);
}
/*
function addMarkerPopup - Creates the OL Feature Marker and FramedCloud Popup
*/
function addMarkerPopup(ll, popupClass, popupContentHTML, closeBox, overflow) {
d.log("addMarkerPopup");
// get map
var map = Fusion.getMapById('mapArea');
// build feature
var feature = new OpenLayers.Feature(markerLayer, ll);
feature.closeBox = closeBox;
feature.popupClass = popupClass;
feature.data.popupContentHTML = popupContentHTML;
// feature.data.overflow = (overflow) ? "auto" : "hidden";
var size = new OpenLayers.Size(14,24);
var offset = new OpenLayers.Pixel(-(size.w/2), -size.h);
var appHost = Fusion.getApplicationURL();
var icon = new OpenLayers.Icon(appHost+'images/marker-2.png',size,offset);
var marker = new OpenLayers.Marker(ll,icon);
// create popup and show it.
this.popup = feature.createPopup(feature.closeBox);
map.oMapOL.addPopup(this.popup);
this.popup.show();
// add eventhandler for marker to popup
var markerClick = function (evt) {
if (this.popup == null) {
this.popup = this.createPopup(this.closeBox);
map.oMapOL.addPopup(this.popup);
this.popup.show();
} else {
this.popup.toggle();
}
currentPopup = this.popup;
OpenLayers.Event.stop(evt);
};
marker.events.register("mousedown", feature, markerClick);
markerLayer.addMarker(marker);
}
/*
function mapIsLoaded - Fusion.Event Handler
*/
function mapIsLoaded() {
var map = Fusion.getMapById('mapArea');
// create the markers layer
markerLayer = new OpenLayers.Layer.Markers( "Markers" );
// set units
markerLayer.units = map.oMapOL.units;
// add the marker layer to the OL Map.
map.oMapOL.addLayer(markerLayer);
// set the resolutions for the markers layer
//markerLayer.maxResolution = map.oMapOL.baseLayer.maxResolution;
//markerLayer.minResolution = map.oMapOL.baseLayer.minResolution;
// set extents to be a bit larger then the current area.
/*
var mapWidget = Fusion.getMapById('mapArea');
var maps = mapWidget.getAllMaps();
var map = maps[0];
var bounds = new OpenLayers.Bounds(100000,4800000,600000,5500000);
map._oMaxExtent = bounds
map.oLayerOL.maxExtent = bounds
*/
}
On Fri, Jun 12, 2009 at 8:32 AM, Paul Spencer
<[hidden email]> wrote:
It hasn't been done yet, but it is definitely possible to use OpenLayers.Popup which does a google-style popup dialog on the map. I haven't tried it myself but I have seen it done.
Paul
__________________________________________
Paul Spencer
Chief Technology Officer
DM Solutions Group Inc
http://research.dmsolutions.ca/
--
Paul Deschamps
Applications Specialist
DM Solutions Group Inc.
Office: (613) 565-5056 x28
[hidden email]
http://www.dmsolutions.ca http://research.dmsolutions.ca
_______________________________________________
fusion-users mailing list
[hidden email]
http://lists.osgeo.org/mailman/listinfo/fusion-users