【问题标题】:Nokia OVI map autocomplete feature诺基亚 OVI 地图自动完成功能
【发布时间】:2012-05-20 17:00:25
【问题描述】:

我正在使用 google API 来自动完成用户地址的功能。并且工作正常。 但现在我想使用诺基亚 OVI 地图来实现地址自动完成功能。

请帮助我如何实现。

我正在使用下面的代码

<div id="customSearchBox" class="main-search">
        <span class ="caption">Search For Places:</span>
        <div module="SearchBox">
            <input rel="searchbox-input" class="search-box-bckgrnd" type="text" />
            <div rel="searchbox-list" class="search-list"></div>
        </div>
    </div>
    <script>
        var customSearchBox = new nokia.places.widgets.SearchBox({
            targetNode: 'customSearchBox',
            template: 'customSearchBox',
            searchCenter: function () {
                return {
                    latitude: 52.516274,
                    longitude: 13.377678
                }
            },
            onResults: function (data) {
               //here you have access to data
               alert(data);
            }
        });   
    </script>

如何在这段代码中获得经纬度

谢谢 希瓦姆

【问题讨论】:

    标签: javascript map autocomplete here-api


    【解决方案1】:

    我通过阅读 OVI 地图文档得到了我的问题的答案。

    <script>
            var customSearchBox = new nokia.places.widgets.SearchBox({
                targetNode: 'customSearchBox',
                template: 'customSearchBox',
                searchCenter: function () {
                    return {
                        latitude: 52.516274,
                        longitude: 13.377678
                    }
                },
                onResults: function (data) {
                   //here you have access to data
                   //var a=getData();
                   renderResults(data);
                   //alert(data.results[0]);
                }
            });  
    
            function renderResults (data) {
            var previewList = document.getElementById ('results');
            previewList.innerHTML = '';
    
            var results = data.results;
    
            for (var i = 0, l = results.length; i < l; i++) {
                var result = results[i];
                var resultLi = document.createElement ('li');
                resultLi.innerHTML = result.place.name+" - Lat:"+result.place.location.position.latitude+" Long:"+result.place.location.position.longitude;
                //alert(result.place.location.position.longitude);
                previewList.appendChild (resultLi);
            }
        }
    
        </script>
    

    我希望这对某人有所帮助。

    谢谢 希瓦姆

    【讨论】:

      【解决方案2】:

      对于 jQuery,您可以使用文本字段来执行此操作,因为我不想使用预定义的“搜索框小部件”:

      $('#location_address').autocomplete({
          focus:function (event, ui) {
              return false;
          },
          search:function () {
              $(this).addClass('working');
          },
          open:function () {
              $(this).removeClass('working');
          },
          select:function (event, ui) {
              var position = ui.item.id.split(";");
              var coord = new nokia.maps.geo.Coordinate(parseFloat(position[0]), parseFloat(position[1])) 
      
              $('#location_address').val(ui.item.label)
              $('#location_longitude')[0].value = coord.longitude;
              $('#location_latitude')[0].value = coord.latitude;
              map.setCenter(coord, "default");
              map.setZoomLevel(16); 
          },
          source:function (request, response) {
              var searchCenter = {
                  latitude:52.516274,
                  longitude:13.377678
              };
              nokia.places.search.manager.findPlaces({
                  searchTerm:request.term,
                  onComplete:function (data, status) {
      
                      var nData = data.results.map(function (val, i) {
                          return {
                              value:val.place.name,
                              id:val.place.location.position.latitude + ";" + val.place.location.position.longitude
                          };
                      })
                      response(nData);
      
                  },
                  searchCenter:searchCenter,
                  didYouMean:5
              });
          },
          minLength:2
      });
      

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 2015-11-08
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2019-04-29
        • 2022-08-15
        相关资源
        最近更新 更多