[OpenLayers-Users] set start and end point

Tue Aug 16 12:04:25 EDT 2011

Hi Guys,
I am using pgrouting + openlayers

I am trying to set start and end point layer to pass to pgrouting. I tried the code from  
http://www.pgrouting.org/docs/ol-workshop/ch05.html. But i couldnot get the layer for start and end point. here is my code:

<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<style type="text/css" >
#map {
width: 500px;
height: 500px;
border: 1px solid black;
}
</style>
<script src="openlayers/OpenLayers.js" ></script>
<script type="text/javascript" >

var SinglePoint = OpenLayers.Class.create();
 SinglePoint.prototype = OpenLayers.Class.inherit(OpenLayers.Handler.Point, {
     createFeature: function(evt) {
         this.control.layer.removeFeatures(this.control.layer.features);
         OpenLayers.Handler.Point.prototype.createFeature.apply(this, arguments);
     }
 });

 var start_style = OpenLayers.Util.applyDefaults({
                externalGraphic: "start.png",
                graphicWidth: 18,
                graphicHeight: 26,
                graphicYOffset: -26,
                graphicOpacity: 1
            }, OpenLayers.Feature.Vector.style['default']);

            var stop_style = OpenLayers.Util.applyDefaults({
                externalGraphic: "stop.png",
                graphicWidth: 18,
                graphicHeight: 26,
                graphicYOffset: -26,
                graphicOpacity: 1
            }, OpenLayers.Feature.Vector.style['default']);

var map;
var dublin;
var counties;
var start;
var stop;

function init() {
               var bounds = new OpenLayers.Bounds(
                    297730.375, 217955.328,
                    330136.625, 260578.453
                );
                var options = {
                    controls: [new OpenLayers.Control.PanZoom() ,],
                    maxExtent: bounds,
                    maxResolution: 166.49658203125,
                    projection: "EPSG:29900",
                    units: 'm'
                };
                map = new OpenLayers.Map('map', options);

dublin = new OpenLayers.Layer.WMS( "dublin historical" ,
"http://localhost:8080/geoserver/wms?" ,
{layers: 'Ireland:buildings_geodir',transparent:true} );

 counties = new OpenLayers.Layer.WMS( "counties" ,
"http://localhost:8080/geoserver/wms?" ,
{layers: 'Ireland:dublin_highway1'} );

start = new OpenLayers.Layer.Vector("Start point", {style: start_style});
stop = new OpenLayers.Layer.Vector("End point", {style: stop_style});

map.addLayer(counties);
map.addLayer(dublin);
map.addLayer(start);
map.addLayer(stop);

                map.addControl(new OpenLayers.Control.Navigation());
                map.addControl(new OpenLayers.Control.LayerSwitcher() );
                map.addControl(new OpenLayers.Control.MousePosition({element: $('location')}));
                map.zoomToExtent(bounds);

 controls = {
   start: new OpenLayers.Control.DrawFeature(start, SinglePoint),
      stop: new OpenLayers.Control.DrawFeature(stop, SinglePoint)
    }
    for (var key in controls) {
        map.addControl(controls[key]);
    }
}

function toggleControl(element) {

    for (key in controls) {
        if (element.value == key && element.checked) {

            controls[key].activate();
        } else {
            controls[key].deactivate();
        }
    }
}

</script>
</head>
<body onload="init()" >
<div id="map" ></div>
<li>
        <input type="radio" name="control" value="start" id="startToggle"
                   onclick="toggleControl(this);" />
        <label for="startToggle">set start point</label>
</li>
 <li>
            <input type="radio" name="control" value="start" id="startToggle"
                   onclick="toggleControl(this);" />
            <label for="startToggle">set start point</label>
          </li>

</body>
</html>
-------------- next part --------------
An HTML attachment was scrubbed...
URL: http://lists.osgeo.org/pipermail/openlayers-users/attachments/20110816/2978564b/attachment.html