Search code examples
angularjschartszingchart

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.


Solution

  • Since your question is asking how to get the bar colors, not set the bar colors. I thought my answer would be appropriate as well.

    You can use the API to getobjectinfo from the chart.

    demo here

        $scope.myRender = {  
        events : {  
            complete : function(p) {  
                var info1 = zingchart.exec(p.id, 'getobjectinfo', {
                  object : 'plot',
                  plotindex: 0
              });
                var info2 = zingchart.exec(p.id, 'getobjectinfo', {
                  object : 'plot',
                  plotindex: 1
              });
              console.log(info1, info2);
            }  
        }  
    } 
    

    If youre confused on the $scope.myRender variable you can read up more on the angular directive here.