2013-03-29 31 views
0

enter image description here调整X比例在highchart显示适当比例

基地图像,每个X值有20点不同 和线应显示为直线。

但是由于我添加了2值1025.96和1026.50(如右边表格中的颜色背景所示),并且它仍然对每个数字使用相同的比例,所以线图不是笔直的。

如何在图表中调整这2点显示并使其绘制合适的比例? (显示直线)。

$(document).ready(function() { 


    chart = new Highcharts.Chart({ 
     chart: { 
      renderTo: 'container2950', 
      type: 'line', 
      marginRight: 130, 
      marginBottom: 45 
     }, 
     title: { 
      text: 'Strategy 2, Long C950', 
      x: -20 //center 
     }, 
     subtitle: { 
      text: '', 
      x: -20 
     }, 
     credits: { 
enabled: false 
    }, 
     xAxis: { 
    title: { 
       text: 'SET50 Index ณ วันหมดอายุ' 
      }, 
    categories:  [925,945,965,985,1005,1025,1025.96,1026.5,1045,1065,1085,1105,1125] 

     }, 
     yAxis: { 
      title: { 
       text: 'Profit/Loss (Bath)' 
      }, 
      plotLines: [{ 
       value: 0, 
       width: 1, 
       color: '#808080' 
      }] 
     }, 
     tooltip: { 
      formatter: function() { 
        return '<b>'+ this.series.name +'</b><br/>'+ 
        this.x +': '+ this.y +' บาท'; 
      } 
     }, 
     legend: { 
      layout: 'vertical', 
      align: 'right', 
      verticalAlign: 'top', 
      x: -10, 
      y: 100, 
      borderWidth: 0 
     }, 
     series: [ 
     {name: 'Long C950', data:  [-15300,-15300,-12300,-8300,-4300,-300,-107.99999999999,0,3700,7700,11700,15700,19700]} 
     ] 

    }); 
}); 

回答

1

无需任何代码,看看,我不能肯定,但我怀疑你指定x轴的类别。这将始终等间隔x轴参数,而不是绘制它们的比例。

相反,你应该像这样指定一系列的数据:

data:[ [925,-15300],[945,-15300] ] 

这指定的x,y值对。你也可以这样做:

data:[ {x:925,y:-15300},{x:945,y:-15300} ] 

第二个选项允许你设置其他点属性,如颜色等

+0

请找我上面的代码,并再次咨询我。 – user2194507

+0

我是对的。删除xAxis中的类别并按照我的第一个示例中的建议指定您的数据。我只向他们展示了前两点,但可以用这种方式指定所有点。 – SteveP

+0

看起来很好。非常感谢你。 :-) – user2194507