简体   繁体   中英

javascript function to search all OpenLayers vector features covering a pixel

I have an OpenLayers map that draws features in a vector layer. The features are selectable and have a popup on select. Unfortunately in a lot of cases the features overlap so it can be impossible to select some features. I think that what I need to do to fix this is change my select control so that it uses a click handler and searches the map for features at this point. What sort of function do i need to write? are there any examples of this being implemented before?

This is how the features are drawn:

var vector_Layer = new OpenLayers.Layer.Vector();

function GetFeaturesFromKMLString (strKML) {
    var format = new OpenLayers.Format.KML({
    'internalProjection': new OpenLayers.Projection("EPSG:900913"),
    'extranalProjection': new OpenLayers.Projection("EPSG:4326")    
    });
    return format.read(strKML);
};

vector_Layer.addFeatures(GetFeaturesFromKMLString('$newkml'));

And this is how Layers are currently selected:

var select = new OpenLayers.Control.SelectFeature(vector_Layer, {clickout: true}); 
        vector_Layer.events.on({
            "featureselected": onFeatureSelect,
            "featureunselected": onFeatureUnselect}); 



        map.addControl(select);
        select.activate();

        select.handlers['feature'].stopDown = false; 
        select.handlers['feature'].stopUp = false;

here is the click event listener I was planning on using:

OpenLayers.Control.Click = OpenLayers.Class(OpenLayers.Control, {                
            defaultHandlerOptions: {
                'single': true,
                'double': false,
                'pixelTolerance': 0,
                'stopSingle': false,
                'stopDouble': false
            },

            initialize: function(options) {
                this.handlerOptions = OpenLayers.Util.extend(
                    {}, this.defaultHandlerOptions
                );
                OpenLayers.Control.prototype.initialize.apply(
                    this, arguments
                ); 
                this.handler = new OpenLayers.Handler.Click(
                    this, {
                        'click': this.onClick 
                    }, this.handlerOptions
                );
            }, 

            onClick: function(evt) {
                //function that seachers for and selects features at this point
            },

由于矢量功能使用OpenLayers.Geometry类作为几何描述,因此您应该看一下Geometry,因此有一个可能有用的相交方法:请参阅: http : //dev.openlayers.org/releases/OpenLayers-2.13/doc /apidocs/files/OpenLayers/Geometry/Point-js.html您还需要拦截click事件才能运行相交检查。

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM