在 openlayer 3 中按位置名称放大

Question

我正在尝试通过动态 select 框按州 > 地区 > 村庄的顺序按名称放大位置。

在这一篇中，我创建了两个名为 zoomToExtDist(name) 和 zoomToExtVil(distname,vilname) 的函数。但不知道他们没有工作。我们应该在 openlayers 3 中使用哪个函数。谁能告诉我哪里做错了。这是我创建的 plunker zoom to location updated link

请告诉我在openlayers 3中我们应该使用哪个函数来设置经纬度视图。提前致谢:)

Answer 1

我无法发表评论，因为我没有足够的声誉，但在您的 plunkr 中我没有看到 zoomtodist 和 zoomtovil 功能？它们在哪个文件中？另外，您是否尝试过使用 view.centerOn() [http://openlayers.org/en/v3.14.2/apidoc/ol.View.html#centerOn]？还是分别用view.setCenter()和view.setZoom()进行居中缩放？

Answer 2

试试这个

   $(function() {
    var records = jsonList.listval;
   // console.log(records);
    insert($('#state_id'), plucker(records, 'state'));
    //------------------------^ grabs unique states
    //--^ populate state list on DOM ready
    $('select').on('change', function() {
      var category = this.id.split('_id')[0];
      var value = $(this).find('option:selected').text();
      switch (category) {
        case 'state':
          {
            insert($('#district_id'), plucker(filter(records, 'state', value), 'district'));

             break;
          }
        case 'district':
          {
            insert($('#village_id'), plucker(filter(records, 'district', value), 'village'));
            break;
          }
          case 'village':
          {

             zoomToExtDist($(this).val());
            break;
          }
      }

  });


        function zoomToExtDist(name)
        { console.log(name);
            for (var i = 0; i < jsonList.listval.length; i++)
             {
              if(name==jsonList.listval[i].village)
              {
                  var tlon = parseFloat(jsonList.listval[i].longitude);
                  var tlat = parseFloat(jsonList.listval[i].latitude);
                  //var lonlat = new OpenLayers.LonLat(tlat,tlon);
                   map.getView().setCenter(ol.proj.fromLonLat([tlat, tlon]));
                  map.getView().setZoom(5);

              }
             }

        }
....

http://plnkr.co/edit/Rja2b1dLsJm7FDFtlUJ0?p=preview

在 openlayer 3 中按位置名称放大

Zoom in to by name of location in openlayer 3

javascript

openlayers-3