I'm following an OpenLayers tutorial from OpenGeo, and am struggling with a vector layer which reads a GeoRSS encoded XML file of earthquake locations - which seems to be used a lot in these sort of tutorials. The maps produces a single point (at 0,0) which on closer examination appears to be all the points in the file stacked on top of each other so clearly something is going wrong between the translation of the point in the XML and OpenLayers.
Here's the code:
var geographic = new OpenLayers.Projection("EPSG:4326");
var mercator = new OpenLayers.Projection("EPSG:900913");
var world = new OpenLayers.Bounds(-180, -89, 180, 89).transform(
geographic, mercator
);
var center = new OpenLayers.LonLat('.$centerMapLat.','.$centerMapLon.').transform(
geographic, mercator
);
var options = {
projection: mercator,
units: "m",
maxExtent: world
};
var map = new OpenLayers.Map("map-id", options);
var osm = new OpenLayers.Layer.OSM();
map.addLayer(osm);
map.addControl(new OpenLayers.Control.LayerSwitcher());
map.setCenter(center, 2);
var mapdata = new OpenLayers.Layer.Vector("Map Data", {
strategies: [new OpenLayers.Strategy.Fixed()],
protocol: new OpenLayers.Protocol.HTTP({
url: "7day-M2.5.xml",
format: new OpenLayers.Format.GeoRSS()
})
});
map.addLayer(mapdata);
XML file is in the following format:
<feed xmlns="http://www.w3.org/2005/Atom" xmlns:georss="http://www.georss.org/georss">
<updated>2012-01-23T09:43:22Z</updated>
<title>USGS M 2.5+ Earthquakes</title>
<subtitle>Real-time, worldwide earthquake list for the past 7 days</subtitle>
<link rel="self" href="http://earthquake.usgs.gov/earthquakes/catalogs/7day-M2.5.xml"/>
<link href="http://earthquake.usgs.gov/earthquakes/"/>
<author><name>U.S. Geological Survey</name></author>
<id>http://earthquake.usgs.gov/</id>
<icon>/favicon.ico</icon>
<entry>
<id>urn:earthquake-usgs-gov:ak:10395995</id>
<title>M 2.7, Alaska Peninsula</title>
<updated>2012-01-23T09:38:43Z</updated>
<link rel="alternate" type="text/html" href="http://earthquake.usgs.gov/earthquakes/recenteqsww/Quakes/ak10395995.php"/>
<summary type="html">
<![CDATA[<img src="http://earthquake.usgs.gov/images/globes/60_-155.jpg" alt="57.806°N 156.412°W" align="left" hspace="20" />
<p>Monday, January 23, 2012 09:38:43 UTC<br>Monday, January 23, 2012 12:38:43 AM at epicenter</p>
<p><strong>Depth</strong>: 122.70 km (76.24 mi)</p>]]></summary><georss:point>57.8058 -156.4123</georss:point>
<georss:elev>-122700</georss:elev>
<category label="Age" term="Past hour"/>
</entry>
[:]
</feed>
It doesn't seem to matter what value is placed between the tags, or how many fields I cut out, the point always appears at 0,0. I can move the spot by editing the coordinates manually in firebug - this is what is rendered in the html for each point:
<circle id="OpenLayers.Geometry.Point_424"
cx="4.738678387182473" cy="237.58907791425827"
r="6" fill="#ee9900" fill-opacity="0.4" stroke="#ee9900" stroke-opacity="1" stroke-width="1" stroke-linecap="round" stroke-linejoin="round" stroke-dasharray="none" pointer-events="visiblePainted" cursor="inherit">
I strongly suspect I have done something wrong, so would appreciate a sanity check
The problem is that while projection of map and background layer(OSM) is "EPSG:900913" the points that you're loading from GeoRSS are in "EPSG:4326".
EPSG:900913 coordinate look like this: 20037508, 20037508. In EPSG:4326 range of coordinates is between -180 and 180 that's why it seems like all points are around 0,0 on your map.
The solution is to reproject GeoRSS points by specifying projection when you create vector layer:
var mapdata = new OpenLayers.Layer.Vector("Map Data", {
strategies: [new OpenLayers.Strategy.Fixed()],
protocol: new OpenLayers.Protocol.HTTP({
url: "7day-M2.5.xml",
format: new OpenLayers.Format.GeoRSS()
}),
projection: geographic
});