動態生成條形顏色

有沒有什麼方法可以在ZingChart中動態生成條形顏色？在屏幕截圖中有在條形圖中生成了兩種顏色，我想要獲取條形圖中使用的顏色列表。動態生成條形顏色

HTML文件

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

控制器

$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, 
    }, 
    };

和barValues是整數值的列表。

來源

2016-11-14 piyush singh

在這裏發佈您的代碼 – Sajeetharan

@Sajeetharan我已經發布了代碼。 –

由於您的問題是詢問如何獲取條形顏色，請勿設置條形顏色。我想我的答案也是適當的。

您可以使用圖表中的getobjectinfo的API。

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); 
     } 
    } 
}

如果youre困惑的$scope.myRender變量，你可以更多的閱讀了關於角指令here。

來源

2016-11-16 18:56:04 nardecky

您可以自己設置顏色像這樣，

$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

來源

2016-11-14 14:20:33 Sajeetharan

您可以指定顏色，字體等。

例如

scaleX: { 
    labels: ['Facebook','Apple', 'Microsoft', 'Intel','Google', 'Amazon'], 
    item: { 
    fontFamily: "Roboto", 
    fontSize: 14 
    }, 
    lineColor: "#DDD", 
    tick:{ 
    visible: false 
    } 
},

來源

2016-11-14 14:25:02

動態生成條形顏色

回答

相關問題