Question

好吧，今天我遇到了高图问题，我正在努力解决以下问题： 1.我正在调用ajax然后更改柱形图系列数据，如下所示：

if(data == 2) {

chart.series[0].setData([
['2009', 140],['2010', 200],['2011',   100],
['2009', -200],['2010',   -120],['2011', -240]]);
}

2。我想要的是将这些信息以镜像图的方式显示为两个组名＆＃34; UK＆＃34;，＆＃34; AUS＆＃34;所以数据将显示如英国 - 2009年，2010年，2011年和2009年，2010年，2011年相同（但具有负值） 3.我想要的演示是http://www.highcharts.com/demo/column-negative

因此，简而言之，如果ajax从php页面带来数据= 2，那么我想将列图表值转换为负图表值，其中包含附加highcahrt演示链接等组系列。

伙计们我正在努力解决这个问题已经很久了，真的需要帮助。因此，如果有人知道如何处理chart.series [0] .setData或其他任何方法，那将会很棒。先谢谢

嗨我想动态地想要我的图形

我建议回答后，我正在得到这样的答案：

代码：

                                function requestData() {
                                    chart = $('#column_chart').highcharts();

                                    $.ajax({
                                        type: "POST",
                                        url: "graph_advanced_file.php",
                                        data: {sliceName: ch},
                                        success: function(data) {
                                            //store local storage.....

                                            localStorage.setItem("current_item", ch);

                                            //alert(data);
                                            //Now, check whatever data is coming through serve accordingly......to load some data.....of that perticular....
                                            if(data == 1) {
                                                //Travel..so get series data....
                                                <?php
                                                    //$each_slice_series = array();
                                                    //$each_slice_series = getSliceInfo(1);
                                                    //$sliceId = 1;
                                                    //call and get the figure....
                                                ?>
                                                chart.series[0].setData([
                                                ['Mand',   200],
                                                ['Sand',   800],
                                                ['Land', 700]]);
                                            }
                                            if(data == 2) {
                                                //Garment....So get series data....
                                                var options = {
                                                  chart: {
                                                      type: 'column'
                                                  }, 
                                                  plotOptions: {
                                                      series: {
                                                          stacking: 'normal'
                                                      }
                                                  }
                                                };

                                               //Load new options to chart   
                                               chart.setOptions(options);
                                                chart.series[0].setData([
                                                  ['2009', 140],['2010', 200],['2011',   100],
                                                  ['2009', -200],['2010',   -120],['2011', -240]]);

                                               chart.series[0].name="Uk";

                                               chart.series[1].setData([
                                                      ['2009', 180],['2010', 100],['2011',   150],
                                                      ['2009', -250],['2010',   -130],['2011', -270]]);

                                               chart.addSeries({ 
                                                  name: "AUS", 
                                                  data: [ ['2009', 180],
                                                          ['2010', 100],
                                                          ['2011', 150], 
                                                          ['2009', -250],
                                                          ['2010', -130],
                                                          ['2011', -270]] 
                                               });

                                               chart.redraw();

                                                //chart.series[0].setData([
                                                //['2009', 140],['2010', 200],['2011',   100],['2012', 130],['2013', 190],['2014', 220],['2015', 230],
                                                //['2009', -200],['2010',   -120],['2011', -240],['2012', -220],['2013', -150],['2014', -100],['2015', -250],
                                                //]);

                                            }

现在，这个requestData被调用：

$('#column_chart').highcharts({
                                     chart: {
                                            type: 'column',
                                            events: {
                                                load: requestData
                                                //click: changeLables
                                            }
                                        },
                                        title: {
                                            text: 'Total Sale of each products'
                                        },
                                        subtitle: {
                                            text: '(Click on product name to display monthly details)'
                                        },
                                        credits: {
                                            enabled: false
                                        },
                                        xAxis: {
                                            type: 'category'
                                        },
                                        yAxis: {
                                            title: {
                                                text: 'Products Sale'
                                            }
                                        },

                                        legend: {
                                            enabled: false
                                        },
                                        series: [{
                                            name: 'Product Sale',
                                            colorByPoint: true,
                                            data: [{
                                                name: 'Mand',
                                                y: 200<?php //echo $each_slice_series[0];?>
                                            }, {
                                                name: 'Land',
                                                y: 800<?php //echo $each_slice_series[1];?>
                                            }, {
                                                name: 'Sand',
                                                y: 700<?php //echo $each_slice_series[2];?>
                                            }]
                                        }]
                                    });//End of chart......

让我知道

Answer 1

如果要将柱形图动态更改为镜像图，则必须执行此操作。

if(data == 2) {

   //Create options      
   var options = {
      chart: {
          renderTo: 'container',
          type: 'bar'
      }
    };

   //Load new options to chart   
   chart.setOptions(options);

   //Load new series
   chart.series[0].setData([
      ['2009', 140],['2010', 200],['2011',   100],
      ['2009', -200],['2010',   -120],['2011', -240]]);
   }
}

修改

如果您有两个数据，并且还想按名称对系列进行分组，则必须执行此操作。

if(data == 2) { $('#column_chart').highcharts({ chart: { type: 'column' }, plotOptions: { series: { stacking: 'normal' } }, series: [{ name: 'UK', data: [ ['2009', 140],['2010', 200],['2011', 100], ['2009', -200],['2010', -120],['2011', -240]] }, { name: 'AUS', data: [['2009', 180], ['2010', 100], ['2011', 150], ['2009', -250], ['2010', -130], ['2011', -270]] } ] }); }

希望它对你有所帮助。

如何使用highchart

1 个答案: