有没有办法在一个轴上合并这两个x轴?

时间:2016-12-20 13:19:00

标签: javascript highcharts

我试图将两个x轴组合在一个轴上。

我有两个不同的系列,它们之间的区别在于时间(有时以秒为单位,有时以分钟为单位)

这是我的代码:

var chart = new Highcharts.Chart({
chart:{
  renderTo:'chart',
  zoomType: 'xy',
  type:'line'
},
title: {
  text: '',
  x: -20
},
subtitle:{
  text:'',
  x: -20
},
xAxis:[{
  id:0,
  type:'categories',
  categories:finalarray.time1
},
{
  id:1,
  type:'categories',
  categories:finalarray.time2,
}],
yAxis:{
    title:{
      text:'',
      align:'high'
    },
    labels:{
      overflow:'justify'
    }
  },
  tooltip:{
    crosshairs: [{
      width: 1,
      color: 'red'
    }, true],
    valueSuffix: ''
  },
  plotOptions:{
    series:{
      cursor:'pointer'
    },
    line:{
      dataLabels:{
        enabled:true
      }
    }
  },
  credits:{
    enabled:false
  },
  series:[
    {
      xAxis:0,
      name: finalarray.description1 + " ( " + finalarray.unit1 + " ) ",
      data: finalarray.value1
    },
    {
      xAxis:1,
      name: finalarray.description2 + " ( " + finalarray.unit2 + " ) ",
      data: finalarray.value2
    }
  ]
  });

this is my chart !!

1 个答案:

答案 0 :(得分:0)

要仅使用一个xAxis,请将轴类型设置为datetime,并使用数据x的值作为时间戳记:

Highcharts.chart('container', {
    xAxis: {
        type: 'datetime',
        tickInterval: 5 * 60 * 1000
    },

    series: [{
        data: [
            {x: 1547480600, y: 12},
            {x: 1547540600, y: 21},
            {x: 1547600600, y: 9},
            {x: 1547660600, y: 37}
        ]
    }, {
        data: [
            {x: 1547480600, y: 9},
            {x: 1547535600, y: 2},
            {x: 1547590600, y: 29},
            {x: 1547645600, y: 41}
        ]
    }]
});

实时演示:http://jsfiddle.net/BlackLabel/9c2zba74/