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

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

AutoClicker - Автокликер для популярных тапалок в телеграм, который запускается на вашем ПК в браузере.
CheckTrust - сервис проверки качества сайтов. Экономия до 70% на аренде ссылок.
GoGetLinks - популярная система для получения качественных ссылок в обзорах с размещением навсегда.
Etxt.RU - биржа статей.
FastVPS - качественный VPS/VDS хостинг в германии.
Roistat - система сквозной бизнес-аналитики.

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

Рейтинг:

Дата: 2 ноября 2010 Просмотры

45485

В сегодняшней статье я расскажу Вам, как при разработке сайта я сделал информер погоды для него. Не секрет, что существует огромное количество сервисов, которые предоставляют всевозможные информеры погоды. И все это конечно хорошо, но есть один недостаток. Как правило такие сервисы не позволяют изменить внешний вид информормера. Поэтому приходится все делать самому. Для этого мы воспользуемся замечательным сервисом 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>