Question

我有一个条形图，里面有动态列。我想要的是除了最后一列，所有列都应该是灰色的。最后一栏应该是绿色的。

任何人都可以帮助我吗？

Answer 1

您可以通过这种方式为最后一列提供颜色

function myFunction(){
        if ($('#ucid').val()=='') {
            $("#myModal").modal("hide");
        }else{
         $('#myModal').modal('show'); 
        }

Fiddle link

因此，如果数据数组是动态的，那么对于数组的最后一个值，您必须将最后一个元素作为数组的series: [{ name: 'Test', color:'grey', data: [50, 30, 40, 70, {y: 34, color: '#66ff33'}] }]。

Answer 2

您可以使用zones。

演示：http://jsfiddle.net/udL2ads2/6/

＆＃13;

$(function() {
  var histSuccess = [100, 99, 100, 98, 98, 99.9, 97.5, 100, 95, 90];

  Highcharts.chart('container', {
    chart: {
      type: 'column'
    },
    title: {
      text: 'Column chart with last column different color'
    },
    yAxis: {
      min: 0,
      title: {
        text: 'Total'
      }
    },
    series: [{
      name: 'Test',
      color: 'grey',
      data: histSuccess,
      
      zoneAxis: 'x',
      zones: [{
      	value: histSuccess.length - 1.5,
        color: 'grey'
      },{
      	color: '#66ff33'
      }]
    }]
  });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>

<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>

＆＃13;

突出显示Highcharts中的最后一列

2 个答案: