2014-03-01 118 views
-2

我的問題是,當我使用點擊事件像這樣的:Link 我得到了彈出,但我想顯示從這個API在彈出天氣響應: http://api.yr.no/weatherapi/locationforecast/1.8/?lat=60;lon=15 我怎樣才能去做?我的代碼:從點擊座標到API

OpenLayers.Control.Click = OpenLayers.Class(OpenLayers.Control, { 
    defaultHandlerOptions: { 
     'single': true, 
     'double': false, 
     'pixelTolerance': 0, 
     'stopSingle': false, 
     'stopDouble': false 
    }, 

    initialize: function (options) { 
     this.handlerOptions = OpenLayers.Util.extend(
      {}, this.defaultHandlerOptions 
     ); 
     OpenLayers.Control.prototype.initialize.apply(
      this, arguments 
     ); 
     this.handler = new OpenLayers.Handler.Click(
      this, { 
       'click': this.trigger 
      }, this.handlerOptions 
     ); 
    }, 

    trigger: function (e) { 
     //A click happened! 
     var lonlat = map.getLonLatFromViewPortPx(e.xy) 

     lonlat.transform(
      new OpenLayers.Projection("EPSG:900913"), 
      new OpenLayers.Projection("EPSG:4326") 
     ); 

     alert("You clicked near " + lonlat.lat + " N, " + 
            +lonlat.lon + " E"); 
    } 

}); 

    OpenLayers.ProxyHost = "../../Proxy/proxy.aspx?url="; 
    var map; 
    function initMap(){ 
     map = new OpenLayers.Map("mapCont"); 
     var osm = new OpenLayers.Layer.OSM(); 
     map.addLayer(osm); 
     var google = new OpenLayers.Layer.Google("GoogleMaps"); 
     map.addLayer(google); 

     addAdditionalControls(); 
     map.setCenter(new OpenLayers.LonLat(2452105.33, 9780412.11), 15) 

     addWMSservice(); 
     var click = new OpenLayers.Control.Click(); 
     map.addControl(click); 
     click.activate(); 

     info = new OpenLayers.Control.WMSGetFeatureInfo({ 
      url: 'http://localhost:8080/geoserver/wms', 
      title: 'Identify features by clicking', 
      queryVisible: true, 
      eventListeners: { 
       getfeatureinfo: function (event) { 
        map.addPopup(new OpenLayers.Popup.FramedCloud(
        "chicken", 
        map.getLonLatFromPixel(event.xy), 
        null, 
        event.text, 
        null, 
        true 
        )); 
       } 
      } 
     }) 

     map.addControl(info); 
     info.activate(); 
    } 
+0

這個問題實際上與OpenLayers本身無關;你只需要將你的問題分解成更小的部分並逐個解決。每個子任務可能是一個單獨的廣泛問題,但他們可能已經在SO的某個地方回答了。 – kryger

回答

0

下面是一個示例函數,它將加載XML並將其顯示在警報中。

請注意,您的瀏覽器很可能會遇到訪問來源問題,因爲該請求是針對其他域的。

function apiRequest(){ 
    var lat = 60; 
    var lon = 15; 
    var url = "http://api.yr.no/weatherapi/locationforecast/1.8/?lat="+lat+";lon="+lon; 
    $.ajax({ 
     url: url, 
     type: 'GET', 
     success: function(data){ 
      alert((new XMLSerializer()).serializeToString(data)); 
     }, 
     error: function(data) { 
      alert('err:'+data); 
     } 
    }); 
}