@elephent

Графики на HightCharts?

Нужно вывести 2 графика на 1 странице. График 1 выводиться через jSon запрос c localhost/data.php, 2 график выводиться с запроса localhost/data2.php.

Как это вывести?

Вывод с data.php

$(function() {
  init('container', 'data.php');
  init('container2', 'data2.php');
});
 
function init(container, dataSource) {
  options = {
    chart: {
      renderTo: container,
      type: 'line'
    },
    title: {
      text: ''
    },
    subtitle: {
      text: ''
    },
    xAxis: {
      categories: [],
      labels: {
        align: 'center',
        x: -3,
        y: 20,
        formatter: function() {
          return Highcharts.dateFormat('%b-%d', Date.parse(this.value));
        }
      }
    },
    yAxis: {
      title: {
        text: ''
      }
    },
    tooltip: {
      enabled: true,
      formatter: function() {
        return '<b>' + this.series.name +'</b><br/>' + this.x + ': ' + this.y;
      }
    },
    plotOptions: {
      line: {
        cursor: 'pointer',
        point: {
          events: {
          click: function() {
          }
        }
      },
      dataLabels: {
        enabled: true
      }
    }
  },
  series: [{
    type: 'line',
    name: '',
    data: []
  }]
 }
 
 $.getJSON(dataSource, function(json) {
   options.xAxis.categories = json['category'];
   options.series[0].name = json['name'];
   options.series[0].data = json['data'];
   chart = new Highcharts.Chart(options);
 });
}


<script src="http://code.highcharts.com/highcharts.js"></script>
<script src="http://code.highcharts.com/modules/exporting.js"></script>
 
 
<div id="container" style="min-width: 400px; height: 400px; margin: 0 auto"></div>

<div id="container2" style="min-width: 400px; height: 400px; margin: 0 auto"></div>
  • Вопрос задан
  • 275 просмотров
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы