繁体   English   中英

高图-具有tickPositioner的X轴值之间的间距相等

[英]Highcharts - equal spacing between X-axis values having tickPositioner

我正在通过tickPositioner属性传递x轴的一些值。 这些值彼此之间的距离不相等。 我的要求是,即使这些值彼此之间没有相同的差异,我也希望它们彼此等距隔开。 请在下面查看我的代码:

var chart = new Highcharts.Chart({
chart: {
     renderTo: 'container'
 },
 credits: {
     enabled: false
 },
 title: {
     text: 'Duration vs Productive Hours'
 },
 xAxis: [{
     allowDecimals: false,
     title: {
         text: 'Hours'
     },
     labels: {
         rotation: -90,
         align: 'right',
         style: {
             fontSize: '10px'
         }
     },
     tickPositioner: function () {
         var pos;
         tickPositions = [];
         tickStart = 100000;
         for (pos = tickStart; pos <= 1000000000; pos *= 10) {
             tickPositions.push(pos);
         }
         return tickPositions;
     }
 }],
 exporting: {
     width: 1024,
     filename: 'Duration_vs_Productive_Hours',
     buttons: {
         exportButton: {
             menuItems: [{
                 text: 'Export to PNG image',
                 onclick: function () {
                     this.exportChart();
                 }
             }, {
                 text: 'Export to JPEG image',
                 onclick: function () {
                     this.exportChart({
                         type: 'image/jpeg'
                     });
                 }
             }, {
                 text: 'Export to PDF file',
                 onclick: function () {
                     this.exportChart({
                         type: 'application/pdf'
                     });
                 }
             },
             null]
         }
     }
 },
 yAxis: [{
     min: 0,
     tickInterval: 10,
     max: 60,
     labels: {
         formatter: function () {
             return this.value;
         },
         style: {}
     },
     showEmpty: true,
     alternateGridColor: '#f7f7f7',
     gridLineColor: '#e7e7e7',
     allowDecimals: false,
     title: {
         text: 'Duration (Months)',
         style: {}
     }
 }],
 tooltip: {
     crosshairs: true,
     formatter: function () {
         if (this.series.type == 'line') {
             return '' + this.x;
         } else {
             return '' + this.x + ': ' + this.y;
         }
     }
 },
 legend: {
     layout: 'horizontal',
     align: 'center',
     verticalAlign: 'bottom',
     backgroundColor: '#FFFFFF'
 },
 series: [{
     name: 'Other Projects',
     type: 'scatter',
     data: [
         [560000, 13],
         [185250, 11],
         [3625788, 23],
         [1648510, 21],
         [265000, 14],
         [13000000, 43],
         [28000000, 34],
         [1567000, 19],
         [1190000, 20],
         [21000000, 31],
         [7000000, 33],
         [3805200, 30],
         [17000000, 29],
         [1503267, 21],
         [11332332, 29],
         [1485067, 20],
         [5000000, 30],
         [5400000, 22],
         [13000000, 23],
         [3810000, 26],
         [810000, 18],
         [27528218, 26],
         [377319, 14],
         [840000, 22],
         [550000, 13],
         [2643142, 26],
         [412800, 13],
         [2500000, 22],
         [4510000, 19],
         [523116, 15],
         [17600000, 28],
         [2500000, 21],
         [21000000, 29],
         [3500000, 17],
         [620000, 15],
         [163000000, 46],
         [134000000, 41],
         [45000000, 39],
         [13677454, 31],
         [167000000, 52],
         [47000000, 33],
         [49000000, 38],
         [31000000, 38]
     ]
 }, {
     name: 'User Data',
     type: 'line',
     data: [
         [4050000, 0],
         [4050000, 60]
     ]
 }] });

听起来您正在尝试使轴为对数。 尝试设定

xAxis:{
    type:"logarithmic"

并删除。 Tickpositioner。 http://api.highcharts.com/highcharts#xAxis.type

如果执行此操作,则会得到以下信息: http : //jsfiddle.net/TsaMA/ ,其中xAxis刻度线的间距相等,分别为1M,10M和100M。

有两个xAxis设置,它们可能是:tickInterval和tickPixelInterval。 http://api.highcharts.com/highcharts#xAxis.tickInterval

如果您设定

tickInterval:1

您会得到1M,10M和100M,这是我能最接近您想要的东西。

如果您知道图表的宽度,tickPixelInterval很有用。 如果您的图表宽度为1000像素,则可以设置tickPixelInterval:250。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM