javascriptで3つの関数がMVC.NETビューに表示されていますが、上から下には表示されません。インデックスビュー、jqueryの関数が間違った順序で実行されています
私たちのテーブルから都市を取得し、配列にプッシュします。オープン・ウェザー・マップAPIと呼ばれる次の関数のために、
url+cit+key
というURLも作成されていません。温度データを取得するには、新しいURL:sを使用して天気予報地図を呼び出します。
天気予報地図からの気象データは、情報ウィンドウとコンテンツに表示され、マーカーがクリックされたときに後で印刷されます。
第2の関数は毎回最初の関数の前に実行されますが、さまざまなことを試みましたが、何も機能していません。私たちは何ができる?
@model List<IDAbroad.Models.PeopleModell>
@ViewData["Listan"]
@ViewBag.message
<script src="~/Scripts/jquery-1.10.2.min.js"></script>
<div id="map" style="width:100%;height:600px"></div>
<script>
function myMap() {
var myCenter = new google.maps.LatLng(51.508742, -0.120850);
var mapOptions = { center: myCenter, zoom: 2 };
var mapCanvas = document.getElementById("map");
var map = new google.maps.Map(mapCanvas, mapOptions);
var cities = [];
$(document).ready(function() {
var url = '/People/myJson';
var url2 = [];
var url;
var data;
var string = "";
var lat = [];
var lon = [];
var namn;
var i = 1;
var temp = [];
var description = [];
var wIcon = [];
$(function() {
$.getJSON(url, function (data) {
$.each(data, function() {
//cities[i] = this['City'];
cities.push(this['City']);
url2.push('http://api.openweathermap.org/data/2.5/weather?q=' + this['City'] + '&APPID=MYKEY');
console.log("Första loopen: " + this['City']);
i++;
});
console.log("Hela listan med städer: " + cities + '<br>' + " HEEEEEEEEJ" + url2 + '<br>');
});
alert("Ska va etta");
getCities();
});
function getCities() {
$(function() {
console.log("Url 2 längd: " + url2.length);
for (var i = 1; i <= url2.length; i++) {
alert("kom in");
var url3 = url2[i]
$.getJSON(url3, function (data) {
$.each(data, function() {
temp[i] = this['main.temp'];
description[i] = this['description'];
wIcon[i] = this['icon'];
console.log("temperatur: " + temp[i]);
})
});
}
});
};
var i = 1;
$(function() {
$.getJSON(url, function (data) {
$.each(data, function() {
namn = this['Firstname'];
console.log("Position X: " + lat[i]);
console.log("Position Y: " + lon[i]);
var peoplePosition = new google.maps.LatLng(this['Latitude'], this['Longitude']);
var ico = {
url: "/profileImg/" + i + ".jpg",
scaledSize: new google.maps.Size(35,50)
}
var marker = new google.maps.Marker({
position: peoplePosition,
icon: ico
})
i++;
marker.setMap(map);
var content = this['Firstname'] + '<br>Stad: ' + this['City'] + '<br>Temp: ' + temp[i] + '<br>' + description[i];
var infowindow = new google.maps.InfoWindow()
google.maps.event.addListener(marker, 'click', (function (marker, content, infowindow) {
return function() {
infowindow.setContent(content);
infowindow.open(map, marker);
};
i++
})(marker,content,infowindow));
})
})
});
});
}
</script>
<script src="https://maps.googleapis.com/maps/api/js?key=MYSECONDKEY">
</script>
この方法のようなものを定義していない理由は本当に曖昧であるドキュメントの準備で実行するように他のコードを登録する機能MYMAP最初にコールする必要があるということ可能な重複:[非同期呼び出しからの応答を返すにはどうすればいいですか?](https://stackoverflow.com/questions/14220321/how-do-i-return-the-response-from-an-asynchronous-call) – abhishekkannojia
OMGでは、 'function'の' document.ready'の 'function'に' document.ready'があります。実行が完全に乱れているのは不思議ではありません。 1つのメイン 'document.ready'を作成し、内部にすべての関数を入れます。文書は1度だけ準備ができています。 –
BTW '$(document).ready('は '$(function(){'と同じです(後者は省略形です) –