javascript — отображение погодных условий для местоположения событий в переполнении стека

Question

javascript — отображение погодных условий для местоположения событий в переполнении стека

Я разработал сайт регистрации событий на PHP. Когда пользователи просматривают событие, я должен показать погодные условия этого места. Я получил код от

https://openweathermap.org/widgets-constructor

И код здесь:

<div id="openweathermap-widget-14"></div>

<script>
window.myWidgetParam ? window.myWidgetParam : window.myWidgetParam = [];
window.myWidgetParam.push({
id: 14,
cityid: '1254589',
appid: '<appId>', // Anonymised appId
units: 'metric',
containerid: 'openweathermap-widget-14',
});
(function () {
var script = document.createElement('script');
script.async = true;
script.charset = "utf-8";
script.src = "//openweathermap.org/themes/openweathermap/assets/vendor/owm/js/weather-widget-generator.js";
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(script, s);
})();
</script>

Но я хочу знать, как динамически передавать идентификатор города

0

javascript openweathermap php

Решение

По вопросам рекламы [email protected]

Accepted Answer

Если вы заранее знаете список городов, которые хотите поддержать, вы можете использовать список city.list.json.gz перечисленных Вот создать карту выбранных городов, которые вы можете использовать для динамического поиска cityId и замените этот параметр в фрагменте, которым вы поделились

var cityMap = {
"mumbai": {
id: 1275339,
displayName: 'Mumbai'
},
"bangalore": {
id: 1277333,
displayName: 'Bangalore'
}
}

function loadWeather(containerId, city) {
var cityId = cityMap[city].id;
window.myWidgetParam = [];
window.myWidgetParam.push({
id: 14,
cityid: cityId,
appid: '<appId>', // Anonymised app Id
units: 'metric',
containerid: containerId,
});
(function() {
var script = document.createElement('script');
script.async = true;
script.charset = "utf-8";
script.src = "//openweathermap.org/themes/openweathermap/assets/vendor/owm/js/weather-widget-generator.js";
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(script, s);
})();
}


function handleButtonClick(e) {
var city = e.target.dataset.city || 'bangalore';
loadWeather("openweathermap-widget-14", city);
}

Array.from(document.getElementsByClassName('selector')).forEach(function(el){
el.addEventListener('click', handleButtonClick);
});

<button class="selector" data-city="bangalore">Bangalore</button>
<button class="selector" data-city="mumbai">Mumbai</button>

<div id="openweathermap-widget-14"></div>

0

Другие решения

Других решений пока нет …

Источник