如何在OpenLayers map 4.6.4版上激发、模拟或调度单击事件?

如何在OpenLayers map 4.6.4版上激发、模拟或调度单击事件?,openlayers,Openlayers,我有一张地图,上面有一个从geoserver加载的wfs图层,这些功能是使用bbox策略加载的,因为其中有60000多个。我有一个简单的点击功能,可以显示每个功能的信息 map.on('click', function(evt) { //random stuff to do here var pixel = evt.pixel; displayFeatureInfo(pixel); //function to get features and display the info });

我有一张地图,上面有一个从geoserver加载的wfs图层,这些功能是使用bbox策略加载的,因为其中有60000多个。我有一个简单的点击功能,可以显示每个功能的信息

map.on('click', function(evt) {
//random stuff to do here
  var pixel = evt.pixel;
  displayFeatureInfo(pixel); //function to get features and display the info
});
对于我的搜索栏,我使用easyAutocomplete搜索每个多边形都有中心坐标的json。它找到了包裹,得到了lat和long,然后平移到包裹上,然后放大

onChooseEvent: function(evt) {
    var parcelValue=$("#name").getSelectedItemData().parcel;
    document.getElementById('name').value=parcelValue;
    var selectedItemCoordX = $("#name").getSelectedItemData().long;
    var selectedItemCoordY = $("#name").getSelectedItemData().lat;
    var valcoordx=parseFloat(selectedItemCoordX);
    var valcoordy=parseFloat(selectedItemCoordY);
    var coords=[valcoordx, valcoordy];
    var pixel = map.getPixelFromCoordinate(coords);
    map.getView().setCenter(ol.proj.transform(coords, 'EPSG:4326', 'EPSG:3857'));
    map.getView().setZoom(19);

  }
如何使用抓取的坐标或像素,并在选择后在地图上单击,以便在移动到地图上后,单击事件被触发,弹出窗口将显示,而用户无需手动执行


我在地图、视口和画布上尝试了.trigger(“单击”),也尝试了.click()和triggerEvent()函数,但这些函数都不会产生错误。我还尝试了
map.dispatchEvent(“单击”)这会产生以下错误
未捕获类型错误:无法读取未定义的属性“slice”

我从未找到解决问题的好方法,但我确实找到了解决方法。我切换到自动完成界面,并从中添加了搜索栏。我将此栏上的可见性设置为“隐藏”。只要功能加载到页面上,ol ext搜索栏就可以轻松搜索任何层。因此,我使用jQuery autocomplete从我的数据库中获取特性id,在这里我搜索我的数据库(它必须是唯一的,并且必须有零填充),然后以编程方式将其作为值输入olext搜索栏。jQuery栏将缩放到我的坐标,我设置了一个超时以确保加载特性,并在以编程方式从ol ext搜索栏中选择结果之前设置了一个超时以确保其已更新。然后根据id选择正确的地块

$(function() {
    $(".auto").autocomplete({
        delay: 500,
        source: "searchData.php",
        minLength: 3,
        maxLength: 20,
        select: function(event,ui){ 
            idS=ui.item.id;
            var label=ui.item.label;
            var value=ui.item.value;
            $(".auto").val(value);
            var coordx=parseFloat(ui.item.long);
            var coordy=parseFloat(ui.item.lat);
            var coords=[coordx, coordy];
            map.getView().setCenter(ol.proj.transform(coords, 'EPSG:4326', 
                'EPSG:3857'));
            map.getView().setZoom(18);
            $('div.ol-search').removeClass('ol-collapsed');
            setTimeout(function(){search.setInput(idS, search)},300);
            setTimeout(function(){$('ul.autocomplete li').trigger("click")},1000);
            $("#sidebar").addClass("collapsed");
        }
    })
});

var search=new ol.control.SearchFeature({
    source: wfsSource,
    property:'id',
    maxItems: 10
});
map.addControl(search);

search.on('select', function(e){    
    select.getFeatures().clear();
    select.getFeatures().push (e.search);
});

就像我说的,它并不漂亮,但它完全有效,甚至没有人知道还有第二个搜索栏。“我的网站”的2.0版将有一个更好的解决方案,但目前还可以使用。

如果有人仍在寻找关于此问题的答案,您可以使用地图对象上的
dispatch
方法手动分派操作。这方面的必要条件(在这个特定的用例中)是同时提供类型和像素坐标。例如,要触发一条消息:

map.on('click', ({ pixel }) => {
  console.debug(`Pixel ${pixel} was clicked`);
});
你可以这样做:

map.dispatchEvent({    //        
  type: 'click',
  pixel: [100, 100],
});

如果你有坐标,你不能只使用
overlay.setPosition(坐标)
并显示弹出窗口吗?或者,如果您更喜欢pixel
getPixelFromCoordinate(坐标)
?它不是一个弹出窗口,而是一个固定位置的边栏,可以打开并显示属性的所有信息。因此,单击会打开相关选项卡上的侧栏(对于单个物业或拥有多达80个业主的公寓等不同),并运行在给定点获取每个功能的功能。我已经使用了上面的
GetPixelFromCoords(coords)
,除了在控制台中检查它以确保它不是未定义的或任何东西外,我不确定我是否正确理解了这一点,但单击事件所做的就是在该像素/坐标处查找功能并调用
displayFeatureInfo(pixel)
,对的如果您知道坐标,您不能使用
getpixelfromacordinate(coords)
并调用
onChooseEvent
中的函数吗?我相信,
displayFeatureInfo
会打开边栏。其他可能的解决方案是找到该功能,推动它选择交互,然后使用
select.on('change',function(){})
var displayFeatureInfo=function(pixel){var features=[];map.forEachFeatureAtPixel(pixel,function(feature,layer){if(layer==layerWFS){features.push(feature);}}}})
这对我来说很有效,OpenLater 6.x+React 16+Material UI 4.9.x。我的OpenLayers映射在一个框中,Material UI组件
const=map?.getLayers().item(1)。dispatchEvent(evt2)
mymap.getLayers().item(1)。on('click',(evt)=>{…})
由于Box正在绑架click事件,我必须将事件发送到其包含的映射中