拉力图 - 列布局问题

时间:2014-03-18 15:48:33

标签: highcharts rally

我在拉力赛应用中的图表中遇到预期结果时遇到问题。我试图获得一个效果,如this jsFiddle示例所示,其中一个系列会围绕另外两个系列创建一个“盒子”效果。

但是,当我在我的Rally应用中呈现它时,pointPaddingpointPlacement属性似乎没有任何效果。我做错了还是这个错误?

Highcharts示例(请参阅jsFiddle enter image description here

拉力赛示例(请参阅下方初始化代码 enter image description here

以下是在App.js中初始化图表的代码:

  myChart = Ext.create('Rally.ui.chart.Chart', {
    id: 'myChart',
    chartColors: ['#00B7E2', '#A6A6A6', '#747474'], //, '#00809E'],
    chartData: {
      categories: this.chartIterations,
      series: [{
        name: 'Planned',
        data: [23, 65, 113, 131, 138], //me.chartPlannedBurnup,
        pointPadding: 0.25,
        pointPlacement: 0.15,
        zIndex: 1
      }, {
        name: 'Actual',
        data: [23, 65, 113, 131, 135], //me.chartActualBurnup,
        pointPadding: 0.25,
        pointPlacement: -0.15,
        zIndex: 2  
      }, {
        name: 'Hardening',
        data: [33, 0, 0, 0, 145], //me.chartHardeningCol,
        pointPadding: -.1,
        pointPlacement: 0.0,
        zIndex: 0,
        enableMouseTracking: false
      }]
    },
    chartConfig: {
      chart: {
        type: 'column'
      },
      title: {
        text: 'Weekly Status Burnup By Release'
      },
      xAxis: {
        labels: {
          rotation: -45,
          align: 'right',
          style: {
            fontSize: '11px',
            fontFamily: 'Verdana, sans-serif'
          }
        },
        tickmarkPlacement: 'on',
        tickInterval: 1,
        title: {
          text: 'Sprints'
        },
      },
      yAxis: {
            title: {
              text: 'Points'
            },
            maxPadding: 0.1
          },
      tooltip: {
        shared: true 
      },
      plotOptions: {
        column: {
          grouping: false,
          shadow: false,
          borderWidth: 0
        }
      }
    }
  });

1 个答案:

答案 0 :(得分:1)

我相信Pawel认为这与HighCharts版本控制的差异有关。 Rally的AppSDK使用Highcharts 2.3.5。你的小提琴指向HighCharts的当前版本3.0.1。

这个小提琴:

http://jsfiddle.net/markwrally/jB8gK/2/

哪一个是您的分支,但指向HighCharts 2.3.5:

<script src="http://code.highcharts.com/2.3.5/highcharts.js"></script>
<script src="http://code.highcharts.com/2.3.5/modules/exporting.js"></script>

似乎表现出与Rally SDK中的屏幕截图相似的行为。

我将与Rally Engineering进行一些检查,了解SDK何时可能更新为使用HighCharts 3的计划/时间。