ILo*_*low 5 javascript angularjs column-chart
1)成功
2)失败
成功:颜色=绿色
对于失败:颜色=红色
但问题是ColumnChart总是以蓝色显示条形,我也想要传说:
Success
Failed
Run Code Online (Sandbox Code Playgroud)
代码:
angular.module("google-chart-sample", ["googlechart"])
.controller("GenericChartCtrl", function ($scope) {
var data = { "data": { "graphResponse": { "cols": [{ "label": "Types", "type": "string" }, { "label": "values", "type": "number" }], "rows": [{ "c": [{ "v": "success" }, { "v": 11 }] }, { "c": [{ "v": "failed" }, { "v": 0 }] }] } } };
$scope.myChartObject = {};
$scope.myChartObject.type = "ColumnChart";
$scope.myChartObject.data = data.data.graphResponse;
$scope.myChartObject.options = {
slices: {
0: { color: '#50ce68' },
1: { color: '#ff7b7b' },
},
};
});Run Code Online (Sandbox Code Playgroud)
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.18/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-google-chart/1.0.0-beta.1/ng-google-chart.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.13.4/ui-bootstrap-tpls.min.js"></script>
<ul ng-app="google-chart-sample" ng-controller="GenericChartCtrl">
<div google-chart chart="myChartObject" style="height:600px; width:100%;"></div>
</ul>Run Code Online (Sandbox Code Playgroud)
我希望成功栏为绿色,失败为红色,我也想要2个传奇(成功 - 绿色和失败 - 红色)
我会感激任何帮助:)