0

我是 Highcharts 的新手。我正在创建从 Java 服务器端 JSON 列表读取的多个系列，JSON 对象包含多个系列，每个系列都有“电 IRms”，然后是“温度”映射到两个 Y 轴标签。

我遇到的问题是第二个 Y 轴单元不显示。JSON 列表格式为

{name, "serialNumber1_type1", {"data", [[timestamp1, value1], 
                                       [[timestamp2, value2], ...
{name, "serialNumber1_type2", {"data", [[timestamp1, value1], 
                                       [[timestamp2, value2], ...
{name, "serialNumber2_type1", {"data", [[timestamp1, value1], 
                                       [[timestamp2, value2], 
{name, "serialNumber2_type2", {"data", [[timestamp1, value1], 
...
{"title","HighCharts Title"}

例如我的 JSON 列表

[{"name":"5004672_IRms"},{"data":[[1373958000000,53],[1373958300000,53]....
 {"name","5004672_Temperature"},{"data":[[1373958000000,80],[1373958300000,81]....
 {"name":"5004687_IRms"},{"data":[[1373958000000,54],[1373958300000,53]..
 {"name","5004687_Temperature"},{"data":[[1373958000000,82],[1373958300000,83]...
 ....
 {"title", "HighCharts_Title"}
]

我的代码如下

$(function() {
 var titleName='';
     var options = {
                chart: {
                    renderTo: 'container',
                    type: 'spline'
                },
                rangeSelector : {
                  {
                 type: 'day',
                 count: 1,
                 text: '1 d'
                  },{
                 type: 'week',
                  count: 1,
                  text: '1 wk'
                  }, {
                 type: 'all',
                 text: 'all'
                 }],
                 selected: 1
                },

                title: {
                  text: '(IRms & Temperature)'
                }, 

                xAxis: {
                     title: {
                         text: 'Time (UTC)'
                     },
                     type: 'datetime',
                     labels: {
                         align: 'left',
             formatter: function() {
            return Highcharts.dateFormat('%I:%M %P', this.value);
             }
                     },
             gridLineDashStyle: 'dot',
             gridLineWidth: 1,
             tickInterval: 60 * 60 * 1000,
             lineWidth: 2,
             lineColor: '#92A8CD',
                         tickWidth: 3,
                         tickLength: 6,
                         tickColor: '#92A8CD',
                },
                yAxis: [{
             labels: {
                formatter: function() {
                    return this.value;
                }
             },
                     title: {
                         text: ''
                     },
         opposite: true
         },
         {
             gridLineWidth: 0,
             title: {
                text: '',
                style: {
                   color: '#4572A7'
                }
             },
             labels: {
                formatter: function() {
                    return this.value +'°F';
                }
            }                   
           }
        ],

                plotOptions: {
                    series: {
                        cursor: 'pointer',
                        point: {
                            events: {
                                ...
                                        width: 200
                                    });

                                    sname = this.series.name;
                                    $.getJSON('/em/em/historypointdetail?pointid=' + sname, function(response) {
                                        ......
                                    });
                                }
                            }
                        },

                        marker: {
                            lineWidth: 
                        }
                    },

                series: []
     };

var serialNumber;
$.getJSON('/em/em/lli?id=<c:out value="${elementIds}" />',function(data)  {
    $.each(data, function(key,value) {  
     $.each(value, function(key,val) {
         if (key == 'name') {
                serialNumber = val;
         }
         else if (key == 'data') {
          var dataseries = { data: []};
              $.each(val, function(key,val) {
                        dataseries.data.push(val);
              });
              dataseries.name=serialNumber;
          var names = serialNumber.split('_');
          if (names[1] == 'IRms') {
               options.title.text = 'Current';
               options.series.yAxis = 0;
               options.yAxis[0].title.text = 'Current';
          }
          else if (names[1] == 'Temperature') {
                 options.title.text = 'Temperature';
                 options.series.yAxis = 1;
                 options.yAxis[1].title.text = 'Temperature';
          }
              options.series.push(dataseries);
          } 
          else if (key == 'title') {
                htext = val;
          }
      });               
    });          

        chart = new Highcharts.StockChart(options);
        chart.setTitle({text: htext});
      }).error(function() {console.log('error');});

我创建了两个 Y 轴和第二个 Y 轴有标签返回 this.value +“F”。但是绘制图表时不显示第二个 Y 轴标签。

谢谢

4

1 回答 1

1

将系列添加到不同的 yAxis 时，您需要指定该 yAxis 的索引或 ID，例如：

var dataseries = { data: [], yAxis: 1};
于 2013-07-18T12:03:29.180 回答