piyush singh piyush singh - 22 days ago 8
AngularJS Question

Get generated bar colour dynamically

Is there any way to generate bar colours dynamically in ZingChart?
in screen-shot there is two colours generated in bar chart, i want to get list of colors used in bar chart.
enter image description here


html file


<zingchart id="timesheet-bar-chart" zc-values="barValues" zc- json="myObj"></zingchart>



controller


$scope.myObj = {
"type": "bar",
"plot":{
"stacked":true,
"stack-type":"normal" /* Optional specification */
},
"scale-x":{
"transform":{
"type":"date",
"all":"%d %M",
"item": {
"visible":false
}
},
"values":$scope.bar_x_axis,
},
};


and barValues is a list of integer values.

Answer

You can set the colors like this,

$scope.myJson = {
        'plot': {
        'styles': ['#yellow', 'red', 'blue']
      },
      'scale-x': {
        'values': ['white', 'red', 'pink']
      },
      'type': 'bar',
      'series': [{
        'text': 'Product History Color',
        'values': [2, 6, 8]
      }]
    }

DEMO