Jump to content
View in the app

A better way to browse. Learn more.

IPBMafia.ru - поддержка Invision Community, релизы, темы, плагины и приложения

A full-screen app on your home screen with push notifications, badges and more.

To install this app on iOS and iPadOS
  1. Tap the Share icon in Safari
  2. Scroll the menu and tap Add to Home Screen.
  3. Tap Add in the top-right corner.
To install this app on Android
  1. Tap the 3-dot menu (⋮) in the top-right corner of the browser.
  2. Tap Add to Home screen or Install app.
  3. Confirm by tapping Install.

Прогноз погоды с помощью Highcharts

Featured Replies

Posted

Решил побаловаться я плюшками от  Highcharts Сделал скрипт прогноза погоды от Гисметео.

Выглядит так: post-1294-0-63588000-1395742899_thumb.jp

Код таков:

$city_id = "4953";
$ch = curl_init();
curl_setopt($ch, CURLOPT_URL, '__www.gismeteo.ua/ua/month/.$city_id./');
curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
curl_setopt($ch, CURLOPT_USERAGENT, $_SERVER['HTTP_USER_AGENT']);
$g_d = curl_exec($ch);
                    //                 Витягуємо графіку
                    $rs01 = explode('<ul class="wtools">',$g_d);
                    $g_d1 = $rs01[1] ;
                    $rs3 = explode('<script type="text/javascript">',$g_d1);
                    $pics = $rs3[0];  //Обробка
   preg_match("!class="wtitle">(.*?)</h1>!si", $pics, $city_name); // отримуємо назву міста
//                  Діаграма на місяць
                    $rs2 = explode('<div class="rframe" id="graph"><div class="fcontent">',$g_d);
                    $g_d2 = $rs2[1] ;
                    $rs4 = explode('</div></div>',$g_d2);
                    $diagram = $rs4[0];  //Обробка
//Максимальна температура
preg_match("!c:[(.*?)],!si", $diagram, $deg_max);
$dg_max = explode(",", $deg_max[1]);
//var_dump ($dg_max);  
$picts01 = strip_tags($pics, '<img>');
preg_match_all("!<img src=(.*?)/>!si", $picts01, $picts);
//Мінімальна температура
preg_match("!cmin:[(.*?)],!si", $diagram, $deg_min);
$dg_min = explode(",", $deg_min[1]);
preg_match("!x:[(.*?)],!si", $diagram, $date);

$count = count($dg_min);
$i=-1; $pl ='';
$dt_bgn = new DateTime(date('d-m-Y',strtotime('0 day')));
$dt_end = new DateTime(date('d-m-Y',strtotime('+'.$count.' day')));
$dt_end1 = $dt_end->modify('+1 day'); 
$interval = new DateInterval('P1D');
$daterange = new DatePeriod($dt_bgn, $interval ,$dt_end1);
$datas = array($dg_min, $dg_max, $daterange);
foreach($daterange as $date):
$i++;
$f_data = $date->format("d.m");
$pl .= "'$f_data'";
if($i<$count)$pl .=',';
endforeach;

// Відмінювання-старт //
$n=$i; // Вставляємо кількість днів
$n = $n % 100;
$n1 = $n % 10;
if ($n > 10 && $n < 20) $word = "днів";
else{
if ($n1 > 1 && $n1 < 5) $word = "дні";
else{
if ($n1 == 1) $word = "день";
else $word = "днів";
}}
// Відмінювання-фініш //
?>
<script type="text/javascript" src"__code.jquery.com/jquery-git2.js"></script>
<script type="text/javascript" charset="utf-8">jQuery.noConflict();</script>
<script type="text/javascript">
jQuery(function () {
        jQuery('#container').highcharts({
            chart: {
                type: 'spline'
            },
            title: {
                 text: 'Прогноз погоди у <?php echo substr($city_name[1],16,-17); ?> '
            },
            subtitle: {
                text: 'на <?php echo $i." {$word}";?> .'
            },
            xAxis: {
                categories: [<?php echo $pl; ?>]
            },
            yAxis: {
                title: {
                    text: 'Teмпература'
                },
                labels: {
                    formatter: function() {
                        return this.value +'°С'
                    }
                }
            },
            tooltip: {
                crosshairs: true,
                shared: true,
valueSuffix: '°C'
            },
            plotOptions: {
                spline: {
                    marker: {
                        radius: 5,
                        lineColor: '#aaa',
                        lineWidth: 4
                    }
                }
            },
            series: [{
                name: 'Максимальна температура',
lineColor: '#ff0000',
color: 'rgba(255, 0, 0, 1)',
                marker: {
symbol: 'square'
                },
                //data: [<?php echo $deg_max[1]; ?>]
<?php
$count = count($picts[1]);
$i=-1; $pl ='data: [';
foreach($picts[1] as $pic):
$i++;
$pl .= "{y:{$dg_max[$i]},";
$pl .= "marker: {symbol: 'url({$pic})'}";
$pl .= "}";
//$pl .= $pic;
if($i<$count)$pl .=',';
endforeach;
echo $pl."]";
?>
            }, {
                name: 'Мінімальна температура',
lineColor: '#0022ff',
color: 'rgba(0, 150, 255, 1)',
                marker: {
                    symbol: 'diamond'
                },
                data: [<?php echo $deg_min[1]; ?>]
            }]
        });
    });
</script>
<script src="__code.highcharts.com/highcharts.js"></script>
<script src="__code.highcharts.com/modules/exporting.js"></script>
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div> 

Можете подганать под себя...

Аякс не конфликтует. Мона сохранять скрины, делать виджет нужных размеров...

Подправлено несколько нюансов...

  1. Так как прогнозы по колличеству дней меняются, то в строке 
    $dt_end = new DateTime(date('d-m-Y',strtotime('+'.$count.' day')));
    указано не конкретное число прогнозируемых дат, а переменная, которая выведет колличество дат исходя из колличества цифр минимальных температур, которые разделены изначально запятой.
  2. Проработал падежи 

    // Відмінювання-старт //
    $n=$i; // Вставляємо кількість днів
    $n = $n % 100;
    $n1 = $n % 10;
    if ($n > 10 && $n < 20) $word = "днів";
    else{
    if ($n1 > 1 && $n1 < 5) $word = "дні";
    else{
    if ($n1 == 1) $word = "день";
    else $word = "днів";
    }}
    // Відмінювання-фініш // 

    относительно надписи, на сколько дней предоставлен прогноз.

Insider, а... ну да...  Локализацию нужно изменить :))) Сам то я под себя делал. но Укр, это не китайский. +/- понятно, думаю ;-) 

ну почти... я его часто не понимаю :D придется своих личных украина - русских переводчиков спрашивать :D

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Ответить в этой теме...

Последние посетители 0

  • No registered users viewing this page.

Configure browser push notifications

Chrome (Android)
  1. Tap the lock icon next to the address bar.
  2. Tap Permissions → Notifications.
  3. Adjust your preference.
Chrome (Desktop)
  1. Click the padlock icon in the address bar.
  2. Select Site settings.
  3. Find Notifications and adjust your preference.