在OpenLayers中过滤加载的kml文件

时间:2012-06-25 20:31:22

标签: filter openlayers kml

我正在尝试创建一个交互式搜索引擎(用于查找事件票据),其中一个功能是使用OpenLayers显示相关场所的可视化地图。我有一个kml文件中的大量场地(3000+),我想有选择地显示一个过滤的子部分。下面是我的代码,但是当我尝试运行它时出现JavaScript错误。运行firebug和chrome开发人员工具让我觉得它没有通过我给出的参数,因为它说变量是null。但是,我无法弄清楚为什么他们没有通过。非常感谢任何见解。

var map, drawControls, selectControl, selectedFeature, select;
$('#kml').load('venuesComplete.kml');
kml=$('#kml').html();
function showVenues(state, city, venue){
    filterStrategy = new OpenLayers.Strategy.Filter({});
    var kmllayer = new OpenLayers.Layer.Vector("KML", {
    strategies: [filterStrategy,
        new OpenLayers.Strategy.Fixed()],
    protocol: new OpenLayers.Protocol.HTTP({
        url: "venuesComplete.kml",
        format: new OpenLayers.Format.KML({
        extractStyles: true,
        extractAttributes: true
        })
    })
    });
    select = new OpenLayers.Control.SelectFeature(kmllayer);
    kmllayer.events.on({
        "featureselected": onFeatureSelect,
        "featureunselected": onFeatureUnselect
    });
    map.addControl(select);
    select.activate();
    filter = new OpenLayers.Filter.Comparison({
        type: OpenLayers.Filter.Comparison.LIKE,
        property: "",
        value: ""
    });
    function clearFilter(){
        filterStrategy.setFilter(null);
    }
    function setFilter(property, value){
        filter.value = value;
        filter.property = property;
        filterStrategy.setFilter(filter);
    }
    var vector_style = new OpenLayers.Style();
    if(venue!=""){
        setFilter('name', venue);
    }else if(city!=""){
        setFilter('description', city);
    }else if(state!=""){
        setFilter('description', state);
    }
    map.addLayer(kmllayer);
    function onPopupClose(evt) {
        select.unselectAll();
    }
    function onFeatureSelect(event) {
        var feature = event.feature;
        var selectedFeature = feature;
        var popup = new OpenLayers.Popup.FramedCloud("chicken", 
            feature.geometry.getBounds().getCenterLonLat(),
            new OpenLayers.Size(100,100),
            "<h2>"+feature.attributes.name + "</h2>" + feature.attributes.description +'<br>'+feature.attributes, 
            null, 
            true, 
            onPopupClose
        );
        document.getElementById('venueName').value=feature.attributes.name;
        document.getElementById("output").innerHTML=event.feature.id;
        feature.popup = popup;
        map.addPopup(popup);
    }
    function onFeatureUnselect(event) {
        var feature = event.feature;
        if(feature.popup) {
            map.removePopup(feature.popup);
            feature.popup.destroy();
            delete feature.popup;
        }
    }
}
function init() {
    map = new OpenLayers.Map('map');
    var google_map_layer = new OpenLayers.Layer.Google(
        'Google Map Layer',
        {type: google.maps.MapTypeId.HYBRID}
    );
    map.addLayer(google_map_layer);
    state="";
    state+=document.getElementById('stateProvDesc').value;
    city="";
    city+=document.getElementById('cityZip').value;
    venue="";
    venue+=document.getElementById('venueName').value;
    showVenues(state,city,'Michie Stadium');
    map.addControl(new OpenLayers.Control.LayerSwitcher({}));
    map.zoomToMaxExtent();

}

1 个答案:

答案 0 :(得分:0)

如果我理解正确,您的kml无法正确加载。如果情况并非如此,请不要理会我的答案。

检查您的kml图层是否正确加载非常重要。我有一个加载多个动态(来自php)kml图层的地图,并且只是不加载大图层并不罕见。当发生这种情况时,操作会中止,但就openlayers而言,图层已正确加载。

所以我做了两件事:我检查加载的数据量是否符合我的原始php kml解析器中的预期功能数量(我使用jquery或ajax调用)然后,如果存在差异,我尝试重新加载(因为这是一个循环,我将它限制为5次尝试,以免无限循环)。

查看我的部分代码here