Openlayers和Jquery自动完成从矢量图层打开弹出框

我正在开发一个使用Openlayers的在线地图。在那张地图上，我有一个显示餐厅的矢量图层。每个餐厅都有一个图标，可以点击打开一个弹出窗口，以显示更多信息。到现在为止还挺好。但我想在Jquery中实现自动完成搜索。所以我想要做的是当你在自动完成中选择一个餐厅名称时，我想要地图打开相应的弹出窗口（触发弹出窗口加上地图和缩放中心）。我设法将地图居中，但我无法弄清楚弹出式打开。Openlayers和Jquery自动完成从矢量图层打开弹出框

这里我使用自动完成代码：

$(function() { 
$("#searchresto").catcomplete({ 
    delay: 0, 
    source: "select_resto.php", 
    select: function (event, ui) 
     { 
      map.setCenter(
      new OpenLayers.LonLat(ui.item.h_lon, ui.item.h_lat).transform(
        new OpenLayers.Projection(Geo_pjt), 
        map.getProjectionObject() 
        ), 5); 
     }, 

    open: function() { 
     $(this).removeClass("ui-corner-all").addClass("ui-corner-top"); 
     }, 
    close: function() { 
     $(this).removeClass("ui-corner-top").addClass("ui-corner-all"); 
     } 

});});

这是我的矢量层：

var resto = new OpenLayers.Layer.Vector("GML", { 
      protocol: new OpenLayers.Protocol.HTTP({ 
       url: "restaurant.php", 
       format: new OpenLayers.Format.GML(), 

      }), 
      strategies: [new OpenLayers.Strategy.Fixed()], 
      projection: map.displayProjection, 
     });

有谁有一个想法如何调用jQuery函数弹出？或者，也许我想要做的事是不可能的？

来源

2014-03-25 cadderrik

经过长时间的敲打我的头在桌子上，我终于找到了自己的答案。

如果你有兴趣见下文：

首先输入您自动完成增加一个 “平变化=” yourFunction中（）”

<input type="text" id="searchresto" onchange="yourfunction(this)"/>

然后在你openlayer：

function getFeatureByHid(featureHId) { 
     var feature = null; 
     var found = false; 
     for(var i=0, len=resto.features.length; i<len; ++i) { 
      if(resto.features[i].attributes.crID == featureHId) { 
       feature = resto.features[i]; 
       found = true; 
       break; 
      } 
     } 

     return feature; 
    } 

    function SelectRestoByRestoId(crID) 
    { 
     var feature = getFeatureByHid(crID); 
     if (feature) 
     { 
      restoSelect.unselectAll(); 
      restoSelect.select(feature); 
     } 
     return true; 
    } 

    function yourfunction(event,ui){ 
     return SelectRestoByRestoId(ui.item.id); 
    }

最后只需在你的自动完成功能中调用你的功能

$(function() { 
$("#searchresto").catcomplete({ 
    delay: 0, 
    source: "select_resto.php", 
    select: yourfunction 

});});

完成!!!! 无论如何thx不回答我真的发展我的Javascript技能！ :) 我希望这会帮助别人！

来源

2014-04-08 15:21:30 cadderrik

Openlayers和Jquery自动完成从矢量图层打开弹出框

回答

相关问题