2

我通过 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]
     ]
 }] });
4

1 回答 1

0

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

xAxis:{
    type:"logarithmic"

并删除。定位器。 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。

于 2013-03-28T06:39:40.410 回答