How can I select a LineString with OpenLayer's SelectFeture at any position of the line?

-1

Following problem: My base layer is a OpenLayers.Layer.OSM.Osmarender layer. I draw a line with OpenLayers.Geometry.LineString in a second vector layer. With the Openlayer SelectFeature I want to select this line. But this is only possible at the startpoint and the endpoint. Is this a bug in the openlayer source?

This is my example: Click on the blue thick line selects the line only at startpoint and endpoint.

<html>
<head>
<title>OpenLayers Example</title>
<script src="http://www.openlayers.org/api/OpenLayers.js"></script>
<script type="text/javascript"src="http://www.openstreetmap.org/openlayers/OpenStreetMap.js"></script>
</head>

<body>
<div style="width:100%; height:100%" id="map"></div>
<script defer="defer" type="text/javascript">

//create map
var options = {
            projection: new OpenLayers.Projection("EPSG:900913"),
    displayProjection: 'EPSG:4326',
    units: "m",
    maxResolution: 156543.0339,
    maxExtent: new OpenLayers.Bounds(-20037508.34, -20037508.34,
                                      20037508.34, 20037508.34),
            controls: [new OpenLayers.Control.PanZoom(), 
                       new OpenLayers.Control.Navigation(),
                       new OpenLayers.Control.MousePosition({"numDigits": 8,
                         displayProjection: new  OpenLayers.Projection("EPSG:4326"),emptyString:"outside the map"}),
                       ]
  };        
map = new OpenLayers.Map('map', options);

// create OSM layer
osm_osma = new OpenLayers.Layer.OSM.Osmarender('OpenStreetMap Osmarender',
    {minZoomLevel: 0,
     maxZoomLevel: 100,
     isBaseLayer: true
    }
);
map.addLayers([osm_osma]);      
var lonlat=transformLonLat("8.3191929972096", "49.015806343698", false);
map.setCenter(lonlat, 17);

//create vector-layer
// Layerstyle
var vlayer_style = OpenLayers.Util.extend({}, OpenLayers.Feature.Vector.style['default']);
vlayer_style.fillOpacity = 0.6;
vlayer_style.fillColor = "green";
vlayer_style.strokeWidth = 6;
vlayer_style.strokeColor = "blue";
vlayer_style.strokeOpacity = 1;

var select_style = OpenLayers.Util.extend({}, vlayer_style);
select_style.fillOpacity = 0.6;
select_style.strokeWidth = 10;
select_style.strokeColor = "black";
select_style.fillColor = "black";
vlayer_style.strokeOpacity = 1;

var vStyleMap = new OpenLayers.StyleMap( {
   "default" :vlayer_style,
   "select" :select_style
});
var vlayer = new OpenLayers.Layer.Vector("vlayer", {styleMap: vStyleMap});
map.addLayer(vlayer);

//create SelectFeatures
var selectControl=new OpenLayers.Control.SelectFeature(vlayer,{displayClass: "selectButton", title: 'Select Ways', 
onSelect:selected, onUnselect:unselected,toggle:false,clickout:true,multiple:false,
hover:false,toggleKey:"ctrlKey", multipleKey:"shiftKey",geometryTypes: ["OpenLayers.Geometry.LineString"],
callbacks: {
    'over': feature_hover,
    'out': feature_hover_out
        }
  });
map.addControl(selectControl);
selectControl.activate();

//Draw Linestring
var waypoint_lon="8.3096336042805";
var waypoint_lat="49.016608500028";
var lonlat=transformLonLat(waypoint_lon, waypoint_lat, false);      
var point=new OpenLayers.Geometry.Point(lonlat.lon, lonlat.lat);
var arrPoint =[];
arrPoint.push(point);

waypoint_lon="8.3274863874837";
waypoint_lat="49.016249642214";
lonlat=transformLonLat(waypoint_lon, waypoint_lat, false);      
point=new OpenLayers.Geometry.Point(lonlat.lon, lonlat.lat);
arrPoint.push(point);

var line = new OpenLayers.Geometry.LineString(arrPoint);    
var lineF = new OpenLayers.Feature.Vector(line,null);

vlayer.addFeatures([lineF]);

//Functions
function transformLonLat(lon, lat, anzeige) {
var lonlat1 = null;
if (anzeige==true)
    lonlat1=new OpenLayers.LonLat(lon, lat).transform(
            new OpenLayers.Projection("EPSG:900913"), // Spherical Mercator Projection
            new OpenLayers.Projection("EPSG:4326") // WGS 1984,
            );
else
    lonlat1=new OpenLayers.LonLat(lon, lat).transform(
            new OpenLayers.Projection("EPSG:4326"), // WGS 1984,
            new OpenLayers.Projection("EPSG:900913") // Spherical Mercator Projection
            );
return lonlat1;
}

function feature_hover( feature ){ 
    feature.layer.div.style.cursor = "crosshair";
}

function feature_hover_out( feature ){ 
    feature.layer.div.style.cursor = "";
}

function selected (obj) {
    alert("select");
}

function unselected (obj) {  
    alert("deselect");
}
</script>
</body>
</html>

openlayers

asked 06 Jan '12, 08:20

stafy
0●1●1●1
accept rate: 0%

Follow this question

By Email:

Once you sign in you will be able to subscribe for any updates here

By RSS:

Answers

Answers and Comments

Markdown Basics

*italic* or _italic_
**bold** or __bold__
link:[text](http://url.com/ "title")
image?![alt text](/path/img.jpg "title")
numbered list: 1. Foo 2. Bar
to add a line break simply add two spaces to where you would like the new line to be.
basic HTML tags are also supported

learn more about Markdown

Question tags:

openlayers ×122

question asked: 06 Jan '12, 08:20

question was seen: 8,968 times

last updated: 06 Jan '12, 08:20

How can I select a LineString with OpenLayer's SelectFeture at any position of the line?

Follow this question

Related questions