диаграмма с высокой четкостью, выбрав месяц в раскрывающемся списке

Сэр добрый вечер. У меня есть графический график, который отображает весь месяц в текущем году. Все, что я хочу, - это добавить выпадающий список месяцев, который, если я выберу месяц, график изменит данные также специально в месяц, выбранный в раскрывающемся списке. Pls help meдиаграмма с высокой четкостью, выбрав месяц в раскрывающемся списке

heres мой код данных.php. Этот код будет просто получать данные без определенного месяца и года. Теперь я хочу разместить раскрывающийся список месяца, например, январь-> декабрь, с текущим годом, и если я выберу месяц из выпадающего графика, он также изменит данные.

 <?php 
$con = mysql_connect("localhost","root"); 

if (!$con) { 
    die('Could not connect: ' . mysql_error()); 
} 

    mysql_select_db("bfp", $con); 

    $query = mysql_query("select city, sum(Miscellaneous) as Miscellaneous, 

sum(Residential) as Residential, sum(Assembly) as Assembly, sum(Educational) as `Educational, sum(Institutional) as Institutional, sum(Mercantile) as Mercantile, sum(Business) as Business, sum(Industrial) as Industrial, sum(Storage) as Storage, sum(Mixed) as Mixed, sum(total) as total from report_structure group by city ");` 

$category = array(); 
$category['name'] = 'City'; 

$series1 = array(); 
$series1['name'] = 'Business'; 

$series2 = array(); 
$series2['name'] = 'Storage'; 

$series3 = array(); 
$series3['name'] = 'Residential'; 

$series4 = array(); 
$series4['name'] = 'Assembly'; 

$series5 = array(); 
$series5['name'] = 'Educational'; 

$series6 = array(); 
$series6['name'] = 'Institutional'; 

$series7 = array(); 
$series7['name'] = 'Mercantile'; 

$series8 = array(); 
$series8['name'] = 'Industrial'; 

$series9 = array(); 
$series9['name'] = 'Miscellaneous'; 

$series10 = array(); 
$series10['name'] = 'Mixed'; 




while($r = mysql_fetch_array($query)) { 
    $category['data'][] = $r['city']; 
    $series1['data'][] = $r['Business']; 
    $series2['data'][] = $r['Storage']; 
    $series3['data'][] = $r['Residential']; 
    $series4['data'][] = $r['Assembly']; 
    $series5['data'][] = $r['Educational']; 
    $series6['data'][] = $r['Institutional']; 
    $series7['data'][] = $r['Mercantile']; 
    $series8['data'][] = $r['Industrial']; 
    $series9['data'][] = $r['Miscellaneous']; 
    $series10['data'][] = $r['Mixed']; 

} 

$result = array(); 
array_push($result,$category); 
array_push($result,$series1); 
array_push($result,$series2); 
array_push($result,$series3); 
array_push($result,$series4); 
array_push($result,$series5); 
array_push($result,$series6); 
array_push($result,$series7); 
array_push($result,$series8); 
array_push($result,$series9); 

array_push($result,$series10); 





print json_encode($result, JSON_NUMERIC_CHECK); 

    mysql_close($con); 
?>

конец data.php

и вот мой structure.php которых данные loaded.can кто-нибудь помочь мне, пожалуйста?

<!DOCTYPE HTML> 
<html> 
    <head> 
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
     <title>Bar chart with data from MySQL using Highcharts</title> 
     <script type="text/javascript" src="jquery-1.10.2.min.js"></script> 
     <script type="text/javascript"> 
     $(document).ready(function() { 
      var options = { 
       chart: { 
        height: 400, 
        width: 1000, 
        renderTo: 'container', 
        type: 'column' 
       }, 
       title: { 
        text: 'Consolidated Fire Incident by Structure in each Station', 
        x: -20 //center 
       }, 
       subtitle: { 
        text: '', 
        x: -20 
       }, 
       xAxis: { 
        categories: [] 
       }, 
       yAxis: { 
        min: 0, 
        title: { 
         text: 'Requests' 
        }, 
        stackLabels: { 
        enabled: true, 
        style: { 
        fontWeight: 'bold', 
        color: (Highcharts.theme && Highcharts.theme.textColor) || 'gray' 
        } 
       } 
      }, 

      tooltip: { 
       formatter: function() { 
        return '<b>'+ this.x +'</b><br/>'+ 
         this.series.name +': '+ this.y; 
       } 
      }, 
      legend: { 
        layout: 'vertical', 
        align: 'right', 
        verticalAlign: 'top', 
        x: -10, 
        y: 100, 
        borderWidth: 0 
       }, 
      plotOptions: { 
       column: { 
        stacking: 'normal', 
        dataLabels: { 
         enabled: false, 
       color: (Highcharts.theme && Highcharts.theme.dataLabelsColor) || 'white' 
        } 
       } 
      }, 

       series: [] 
      } 

      $.getJSON("data.php", function(json) { 
       options.xAxis.categories = json[0]['data']; 
       options.series[0] = json[1]; 
       options.series[1] = json[2]; 
       options.series[2] = json[3]; 
       options.series[3] = json[4]; 
       options.series[4] = json[5]; 
       options.series[5] = json[6]; 
       options.series[6] = json[7]; 
       options.series[7] = json[8]; 
       options.series[8] = json[9]; 
       options.series[9] = json[10]; 

       chart = new Highcharts.Chart(options); 
      }); 
     }); 
     </script> 
     <script src="highcharts.js"></script> 
     <script src="exporting.js"></script> 
    </head> 
    <body> 
<div id="container" style="min-width: 400px; height: 800px; margin: 0 auto"></div> 
    </body> 
</html>

источник

2014-01-12 jcbbea

вы можете сделать это двумя разными способами.

хранить все данные в течение месяца в виде отдельных наборов данных. добавьте их, чтобы получить данные за целый год. когда пользователь выбирает какой-либо месяц в выпадающем списке, затем обновляет данные серии или повторно отображает диаграмму
Вы можете использовать метод setExtremes() для xAxis в зависимости от месяца, выбранного в раскрывающемся списке.

, если пользователь выбирает июнь установить экстремумы XAxis с 1 июня по 30 июню

Надеется, что это поможет вам

источник

2014-01-13 04:47:03 Strikers

спасибо ответа для г. я уже решу свою проблему :) – jcbbea

диаграмма с высокой четкостью, выбрав месяц в раскрывающемся списке

ответ

Смежные вопросы