[OpenLayers-Users] popup with wfs marker layer...
David Robison
drrobison at openroadsconsulting.com
Sun Mar 11 15:22:09 EDT 2007
Here is how I approached this problem, the basic approach is to define you own feature class in javascript. For example, I add the WFS features to my OpenLayers map as follows:
map.addLayer(new OpenLayers.Layer.WFS("DOT Cameras", "http://localhost:8080/geoserver/wfs?",
{typename: "vagis:snapshots", maxfeatures: 2000},
{ featureClass: ORCI.Feature.wfsSnapshots}));
Then I define my feature class as:
ORCI = new Object();
ORCI.Feature = new Object();
var imgCnt = 0;
var playSnapshotTimer = 0;
var playSnapshotOid = 0;
function playSnapshot(oid, cycle, url) {
if (playSnapshotTimer != 0) dojo.lang.clearTimeout(playSnapshotTimer);
if (oid != playSnapshotOid) return;
document.images['SnapshotImg'].src = url + "?" + imgCnt;
imgCnt++;
var div = document.getElementById("iconDetail");
if (div.Oid == oid) playSnapshotTimer = dojo.lang.setTimeout(playSnapshot, cycle * 1000, oid, cycle, url);
}
ORCI.Feature.wfsSnapshots = OpenLayers.Class.create();
ORCI.Feature.wfsSnapshots.prototype =
OpenLayers.Class.inherit( OpenLayers.Feature, {
/**
* @constructor
*
* @param {OpenLayers.Layer} layer
* @param {XMLNode} xmlNode
*/
initialize: function(layer, xmlNode) {
var newArguments = arguments;
var data = this.processXMLNode(xmlNode);
data.icon = cameraIcon.clone();
newArguments = new Array(layer, data.lonlat, data)
OpenLayers.Feature.prototype.initialize.apply(this, newArguments);
this.createMarker();
this.marker.xmlNode = xmlNode;
this.marker.Oid = data.cameraId;
this.layer.addMarker(this.marker);
this.marker.events.register("mousedown", this.marker, function(evt) {
if (iconPopup != null) {
map.removePopup(iconPopup);
iconPopup.destroy();
iconPopup = null;
}
var html = xslSnapshotsPlay.transformToDocument(this.xmlNode);
var div = document.getElementById("iconDetail");
div.Oid = data.cameraId;
dojo.dom.replaceChildren(div, html.firstChild);
playSnapshotOid = data.cameraId;
playSnapshot(data.cameraId, data.cycleSecs, data.snapshotURL);
Event.stop(evt);
});
},
destroy: function() {
if (this.marker != null) {
this.layer.removeMarker(this.marker);
}
OpenLayers.Feature.prototype.destroy.apply(this, arguments);
},
/**
* @param {XMLNode} xmlNode
*
* @returns Data Object with 'id', 'lonlat', and private properties set
* @type Object
*/
processXMLNode: function(xmlNode) {
var point = OpenLayers.Ajax.getElementsByTagNameNS(xmlNode, "http://www.opengis.net/gml", "gml", "Point");
var text = OpenLayers.Util.getXmlNodeValue(OpenLayers.Ajax.getElementsByTagNameNS(point[0], "http://www.opengis.net/gml","gml", "coordinates")[0]);
var floats = text.split(",");
var cameraId = OpenLayers.Ajax.getElementsByTagNameNS(xmlNode, "http://www.openroadsconsulting.com/vagis","vagis", "snapshots")[0].attributes['fid'].nodeValue;
var cameraName = OpenLayers.Util.getXmlNodeValue(OpenLayers.Ajax.getElementsByTagNameNS(xmlNode, "http://www.openroadsconsulting.com/vagis","vagis", "camera_name")[0]);
var snapshotURL = OpenLayers.Util.getXmlNodeValue(OpenLayers.Ajax.getElementsByTagNameNS(xmlNode, "http://www.openroadsconsulting.com/vagis","vagis", "snapshot_url")[0]);
var cycleSecs = OpenLayers.Util.getXmlNodeValue(OpenLayers.Ajax.getElementsByTagNameNS(xmlNode, "http://www.openroadsconsulting.com/vagis","vagis", "cycle_seconds")[0]);
return {lonlat: new OpenLayers.LonLat(parseFloat(floats[0]),
parseFloat(floats[1])),
id: cameraId,
cameraId: cameraId,
cameraName: cameraName,
snapshotURL: snapshotURL,
cycleSecs: cycleSecs
};
},
/** @final @type String */
CLASS_NAME: "ORCI.Feature.wfsSnapshots"
});
The "initialize" function creates a "marker" on the WFS layer and then parses the XML document to create the data for the marker. It also then registers the mousedown event to create a popup (in this case, it displays an image that is updated on a timer). The main part of the code that will need to be written is the processXMLNode to parse the GIS data from the WFS and the "mousedown" event handler to do what every you please. I hope this helps. It may look a bit complicated, but when you get right down to doing it in the code it is quite straight forward and efficient. Kudos to the OpenLayer team for how they implemented WFS access!
David Robison
_____
From: John Cole [mailto:john.cole at uai.com]
To: 'users at openlayers.org' [mailto:users at openlayers.org]
Sent: Sat, 10 Mar 2007 16:15:32 -0500
Subject: [OpenLayers-Users] popup with wfs marker layer...
I'm trying to create a popup based off of a WFS layer, but I'm a little
unclear on which object I should register for the call back.
I'd like it to work similar to the Text layer, where I click on a marker and
it displays the info from the WFS object. The Text layer puts a popup
handler on each marker. With the WFS layer, I can get an event registered
so it is called when a marker is clicked, but I don’t yet understand how to
tie the event back to the information in the WFS layer.
I'd appreciate a suggestion or pointer on how to implement this type of
popup.
Thanks,
John
--
No virus found in this outgoing message.
Checked by AVG Free Edition.
Version: 7.5.446 / Virus Database: 268.18.8/716 - Release Date: 3/9/2007
6:53 PM
This email and any files transmitted with it are confidential and intended solely for the use of the individual or entity to whom they are addressed. If you have received this email in error please notify the sender. This message contains confidential information and is intended only for the individual named. If you are not the named addressee you should not disseminate, distribute or copy this e-mail.
_______________________________________________
Users mailing list
Users at openlayers.org
http://openlayers.org/mailman/listinfo/users
-------------- next part --------------
An HTML attachment was scrubbed...
URL: http://lists.osgeo.org/pipermail/openlayers-users/attachments/20070311/23c2fd28/attachment.html
More information about the Users
mailing list