Генератор форм

Для веб-мастера

Реклама


Создаем информер погоды на своем сайте

Рейтинг:
Дата: 2 ноября 2010 Просмотры 33601 Комментарии 33

В сегодняшней статье я расскажу Вам, как при разработке сайта я сделал информер погоды для него.  Не секрет, что существует огромное количество сервисов, которые предоставляют всевозможные информеры погоды. И все это конечно хорошо, но есть один недостаток. Как правило такие сервисы не позволяют изменить внешний вид информормера. Поэтому приходится все делать самому. Для этого  мы воспользуемся замечательным сервисом http://informer.gismeteo.ru , который позволяет получить данные в формате XML о погоде.  Данные представляют из себя подробную сводку по всем метеопараметрам, которые есть на сайте  http://informer.gismeteo.ru, с шагом 6 часов и заблаговременностью 1 сутки.

Итак, первым делом идем на сайт и узнаем  url-адрес XML-документа, для нужного Вам города. Это можно сделать здесь.

В качестве примера я выбрал свой родной и любимый город Донецк! url-адрес  XML-документа для города Донецк, находится по этой ссылке http://informer.gismeteo.ru/xml/34519_1.xml

Итак, когда мы знаем url-адрес XML-документа, который содержит подробную сводку о погоде, нам остается спарсить её и записать нужную нам информацию в базу данных!  Ну что приступим?

Первым делом посмотрим  сам XML-документ, который выдает нам сервис http://informer.gismeteo.ru:

<MMWEATHER>
  <REPORT  type="frc3">
  <TOWN index="34519" sname="%C4%EE%ED%E5%F6%EA"  
   latitude="48" longitude="37">
     
     <FORECAST  day="26" month="10" year="2010"  
        hour="03" tod="0" predict="0"  weekday="3">
      <PHENOMENA  cloudiness="0" precipitation="10" 
               rpower="0"  spower="0"/>
       <PRESSURE  max="746" min="744"/>
       <TEMPERATURE  max="8" min="6"/>
       <WIND  min="4" max="6" direction="2"/>
      <RELWET  max="94" min="92"/>
      <HEAT  min="5" max="7"/>
   </FORECAST>
     
 <FORECAST  day="26" month="10" year="2010"  
         hour="09" tod="1" predict="0"  weekday="3">
    <PHENOMENA  cloudiness="0" precipitation="10"
          rpower="0"  spower="0"/>
    <PRESSURE  max="745" min="743"/>
    <TEMPERATURE  max="9" min="7"/>
    <WIND  min="4" max="6" direction="2"/>
    <RELWET  max="83" min="81"/>
   <HEAT  min="5" max="7"/>
</FORECAST>
  
<FORECAST  day="26" month="10" year="2010"  
      hour="15" tod="2" predict="0"  weekday="3">
  <PHENOMENA  cloudiness="0" precipitation="10"
  rpower="0"  spower="0"/>
  <PRESSURE  max="743" min="741"/>
  <TEMPERATURE  max="15" min="13"/>
  <WIND  min="3" max="5" direction="3"/>
  <RELWET  max="71" min="69"/>
  <HEAT  min="13" max="15"/>
</FORECAST>
      
<FORECAST  day="26" month="10" year="2010"
  hour="21" tod="3" predict="0"  weekday="3">
  <PHENOMENA  cloudiness="0" precipitation="10"
       rpower="0"  spower="0"/>
  <PRESSURE  max="742" min="740"/>
  <TEMPERATURE  max="11" min="9"/>
  <WIND  min="2" max="4" direction="3"/>
  <RELWET  max="97" min="95"/>
  <HEAT  min="9" max="11"/>
</FORECAST>
</TOWN>
</REPORT>
</MMWEATHER>

Теперь посмотрим на описание формата:


TOWN

информация о пункте прогнозирования:

  index

уникальный пятизначный код города

  sname

закодированное название города

  latitude

широта в целых градусах

 longitude

долгота в целых градусах

FORECAST

информация о сроке прогнозирования:

  day, month, year

дата, на которую составлен прогноз в данном блоке

  hour

местное время, на которое составлен прогноз

  tod

время суток, для которого составлен прогноз: 0 - ночь 1 - утро, 2 - день, 3 - вечер

  weekday

день недели, 1 - воскресенье, 2 - понедельник, и т.д.

  predict

заблаговременность прогноза в часах

PHENOMENA 

атмосферные явления:

  cloudiness

облачность по градациям:  0 - ясно, 1- малооблачно, 2 - облачно, 3 - пасмурно

  precipitation

тип осадков: 4 - дождь, 5 - ливень, 6,7 – снег, 8 - гроза, 9 - нет данных, 10 - без осадков

  rpower

интенсивность осадков, если они есть. 0 - возможен дождь/снег, 1 - дождь/снег

  spower

вероятность грозы, если прогнозируется: 0 - возможна гроза, 1 - гроза

PRESSURE

атмосферное давление, в мм.рт.ст.

TEMPERATURE

температура воздуха, в градусах Цельсия

WIND

приземный ветер

  min, max

минимальное и максимальное значения средней скорости ветра, без порывов

  direction 

направление ветра в румбах, 0 - северный, 1 - северо-восточный,  и т.д.

RELWET

относительная влажность воздуха, в %

HEAT

комфорт - температура воздуха по ощущению одетого по сезону человека, выходящего на улицу

Итак, прогноз погоды выдается сразу для 4 времен суток. Это:
0 – ночь, 1 - утро, 2 - день, 3 – вечер

Но так как мы хотим показывать у себя на сайте актуальную информацию о погоде, нам необходимо будет в начале определить время суток, а лишь потом, заносить информацию в базу данных!

Итак, с целями и задачами определились. Теперь переходим к непосредственному парсингу XML-документа. Для этих целей мы воспользуемся специальным классом SimpleXML, который появился в РНР 5.0. 

Если вы работаете с РНР версии 5.0 или выше, то поддержка SimpleXML у вас включена по умолчанию, если это не так, используйте опцию конфигурации --enable-simplexml (или --disable-simplexml для отключения).

Прежде чем продолжить создадим таблицу в базе данных, в которой будет храниться информация о погоде. Для этого необходимо выполнить следующий SQL-запрос:

CREATE TABLE IF NOT EXISTS  `weather` (
  `city_id` int(5) NOT NULL,
  `city_name` varchar(25) character set utf8  NOT NULL,
  `temperature_min` smallint(3) NOT NULL,
  `temperature_max` smallint(3) NOT NULL,
  `pressure_min` smallint(4) NOT NULL,
  `pressure_max` smallint(4) NOT NULL,
  `wind_min` smallint(3) NOT NULL,
  `wind_max` smallint(3) NOT NULL,
  `wind_dir` tinyint(1) NOT NULL,
  `relwet_min` tinyint(4) NOT NULL,
  `relwet_max` tinyint(4) NOT NULL,
  `cloudiness` tinyint(1) NOT NULL,
  `precipitation` tinyint(1) NOT NULL
  )  ENGINE=MyISAM DEFAULT CHARSET=cp1251;

Данная таблица содержит следующие поля:

city_id – уникальный идентификатор города на сервисе http://informer.gismeteo.ru. Для города Донецк это 34519
city_name – имя города
temperature_min – минимальная температура воздуха
temperature_max - максимальная температура воздуха
pressure_min – минимальное давление атмосферного воздуха
pressure_max – максимальное давление атмосферного воздуха
wind_min -  минимальное  значение средней скорости ветра
wind_max  -  максимальное значение средней скорости ветра
wind_dir - направление ветра в румбах
relwet_min – минимальная относительная влажность воздуха
relwet_max – максимальная относительная влажность воздуха
cloudiness - облачность по градациям
precipitation - тип осадков

Я специально создал в этой таблице 2 дополнительных поля (уникальный идентификатор и имя города), т.к. в дальнейшем Вы можете добавить несколько городов, и парсить информация для них! Но в данном примере мы будем рассматривать парсинг для одного конкретного города! Итак, идем дальше.

Дальше вставим в эту таблицу данные. Это делается так:

INSERT INTO `weather` (`city_id`, `city_name`, `temperature_min`,
 `temperature_max`, `pressure_min`,  `pressure_max`, `wind_min`, 
 `wind_max`, `wind_dir`, `relwet_min`, `relwet_max`,  `cloudiness`,
 `precipitation`) VALUES (34519, 'Донецк', 9, 11, 740, 742, 4, 6, 6, 
 94, 96, 3, 4)

Так как вся информация хранится в базе данных, то первым делом создадим файл, который будет отвечать за подключение к базе данных MySQL и назовем его db.php

 <?php 
      $DB_host =  "localhost"; // имя сервера MySQL
      $DB_user =  "root";    // имя пользователя MySQL
      $DB_pass =  "pass";    // пароль на сервере MySQL
      $DB_name =   "database";     // имя  базы данных 
      /* Соединяемся с сервером MySQL */
      $db=mysql_connect($DB_host,$DB_user,$DB_pass);
      
      /* Выбираем  необходимую базу    данных */
      mysql_select_db($DB_name, $db);

      /*  Устанавливаем     кодировку */
      mysql_query('SET  NAMES cp1251');
      
 ?>

Далее создадим файл parser.php, который будет отвечать за парсинг и первым делом подключим файл db.php, отвечающий за подключение к базе данных!

require_once('db.php'); //Подключаемся к базе данных

Далее необходимо загрузить XML-данные. Это может быть как файл, так и просто строковая переменная, содержащая XML-код. В нашем случае XML-документ представляет из себя файл, поэтому загружать мы его будем следующим образом:

$xml = simplexml_load_file("http://informer.gismeteo.ru/xml/34519_1.xml");

Далее определим текущей день и время. Это можно сделать так:

$cur_time=date('G');
$cur_date=date('d.m.Y');

Далее определяем время суток:

switch($cur_time){
  case  ($cur_time>=3 && $cur_time<9):
     $tod=1;
     break;
  case  ($cur_time>=9 && $cur_time<15):
    $tod=2;
    break;
  case  ($cur_time>=15 && $cur_time<21):
    $tod=3;
    break;
  case  (($cur_time>=21  &&  $cur_time<23) || 
         ($cur_time>=0   && $cur_time<3)):
    $tod=0;
    break;

 

default: $tod=0;

}

Дальше пробегаем по всем прогнозам для выбранного города и когда находим время суток и дату, соответствующие текущим, записываем температуру в базу:

foreach ($xml->REPORT->TOWN->FORECAST as $forecast ){
$xml_date=$forecast["day"].'.'.$forecast["month"].'.'.$forecast["year"];
  if ($forecast["tod"] == $tod  && $cur_date == $xml_date){

 

        mysql_query("UPDATE `weather` SET `temperature_min` = '”. $forecast->TEMPERATURE['min'].”', `temperature_max` = '”.$forecast->TEMPERATURE['max'].”', `pressure_min` = '”. $forecast->PRESSURE['min'].”', `pressure_max` = '”. $forecast->PRESSURE['max'].”', `wind_min` = '”.$forecast->WIND['min'].”', `wind_max` = '”. $forecast->WIND['max'].”', `wind_dir` = '”. $forecast->WIND['direction'].”', `relwet_min` = '”.$forecast->RELWET['min'].”', `relwet_max` = '”.$forecast->RELWET['max'].”', `cloudiness` = '”.$forecast->PHENOMENA['cloudiness'].”', `precipitation` = '”. $forecast->PHENOMENA['precipitation'].”'   WHERE city_id = 34519 LIMIT 1");

       break; }
}

Так, ну вот собственно парсер и готов! Теперь его надо поставить на cron (планировщик задач) и запускать этот скрипт 4 раза в сутки:  2, 8, 14, 20

Теперь дело за малым! Осталось вывести всю эту информацию на странице!

Я особо не буду "напрягаться" с красотой,  а лишь покажу пример, как можно использовать, ту информацию, которую мы записали в базу данных.  Для этого создадим новый файл и назовем его index.php. Подключим файл db.php, для подключения к базе данных!

require_once('db.php');

Далее сделаем выборку из базы данных для нужного нам города.

$result = mysql_query("SELECT * FROM weather WHERE city_id=34519 LIMIT 1");

Если запись с таким городом есть в базе, то будем использовать его, а если нет, то выведем сообщение!

if(mysql_num_rows($result)  != 1){
  die('Такого  города нет в базе данных!');
  
}
else {
  $myrow = mysql_fetch_assoc($result);
}

Определим среднюю температуру воздуха

$temp = round(($myrow['temperature_min'] + $myrow['temperature_max'])/2);
$myrow['temperature']  = ($temp > 0)? '+'.$temp:$temp;

Дальше определим тип осадков и в зависимости от типа осадков присвоим определенный класс для отображение (солнечно, пасмурно, дождь и т.д.)

switch  ($myrow['cloudiness']){
  case 0:
  switch  ($myrow['precipitation']){
  case 4: $myrow['style'] =  'rainy-cloudy';break;
  case 5: $myrow['style'] =  'rainy-cloudy';break;
  case 6: $myrow['style'] =  'snow';break;
  case 7: $myrow['style'] =  'snow';break;
  case 8: $myrow['style'] =  'thunderstorm';break;
  case 9: $myrow['style'] =  'clear';break;
  case 10: $myrow['style'] =  'clear';break;
  }
  break;
  case 1:
  switch  ($myrow['precipitation']){
  case 4: $myrow['style'] =  'rainy-cloudy';break;
  case 5: $myrow['style'] =  'rainy-cloudy';break;
  case 6: $myrow['style'] =  'snowly-cloudly';break;
  case 7: $myrow['style'] =  'snowly-cloudly';break;
  case 8: $myrow['style'] =  'thunderstorm-cloudly';break;
  case 9: $myrow['style'] =  'cloudy';break;
  case 10: $myrow['style'] =  'cloudy';break;
  }
  break;
  case 2:
  switch  ($myrow['precipitation']){
  case 4: $myrow['style'] =  'rainy-cloudy';break;
  case 5: $myrow['style'] =  'rainy-cloudy';break;
  case 6: $myrow['style'] =  'snowly-cloudly';break;
  case 7: $myrow['style'] =  'snowly-cloudly';break;
  case 8: $myrow['style'] =  'thunderstorm-cloudly';break;
  case 9: $myrow['style'] =  'cloudy';break;
  case 10: $myrow['style'] =  'cloudy';break;
  }
  break;
  case 3:
  switch  ($myrow['precipitation']){
  case 4: $myrow['style'] =  'rainy';break;
  case 5: $myrow['style'] =  'rainy';break;
  case 6: $myrow['style'] =  'snowly-cloudly';break;
  case 7: $myrow['style'] =  'snowly-cloudly';break;
  case 8: $myrow['style'] =  'thunderstorm-cloudly';break;
  case 9: $myrow['style'] =  'cloudy';break;
  case 10: $myrow['style'] =  'cloudy';break;
  }
  break;
  }

Когда стили определены, выведем информацию на странице. Для этого будем использовать следующую html- разметку:

<div class="temperature">
    <div class="current-temperature <?=$myrow['style']?>">
      <span class="test"><?=$myrow['temperature']?>&deg;C</span>
    </div>  
    
     <div class="choose-cur-temp choose-weather-in">
          <span id="current_city"><?=$myrow['city_name']?></span>
    </div>
</div>

Теперь осталось прописать стиль:

<style>

 

.current-temperature {
font:24px/24px Tahoma;
padding-left:35px;
text-align:left;
}

.clear {
background:url("clear.png") no-repeat scroll 0 0 transparent;
}

.cloudy {
background:url("clouds.png") no-repeat scroll 0 0 transparent;
}

.rainy {
background:url("rainy.png") no-repeat scroll 0 0 transparent;
}
.thunderstorm {
background:url("thunderstorm.png") no-repeat
scroll 0 0 transparent;
}
.thunderstorm-cloudly {
background:url("thunderstorm-cloudly.png") no-repeat
scroll 0 0 transparent;
}
.snowly-cloudly {
background:url("snowly-cloudly.png") no-repeat
scroll 0 0 transparent;
}
.snow {
background:url("snow.png") no-repeat scroll 0 0 transparent;
}
.rainy-cloudy {
background:url("rainy-cloudy.png") no-repeat
scroll 0 0 transparent;
}
</style>

Здесь мы прописали фоновые изображения для разных типов осадков! И вот  что у меня получилось:


Не обращайте внимание на температуру воздуха, так как это я делал в качестве примера!!!

Ну вот собственно и все! Скачать исходники и изображения можно здесь! Надеюсь Вам пригодится эта информация! Удачи!

Оцените эту статью:
Интересно почитать

    Получать новые материалы этого сайта на свой email адрес?

    Отправлять мне комментарии по эл. почте?

Реклама

Топ комментаторы

  • Иван (1)

Нашли ошибку в тексте

Система Orphus
https://biznesguide.ru/coding/115.html
3,92 из 5 на основе 39 оценок.
Твиттер Facebook Google plus RSS