是否可以向 AMCharts Donut Graph 添加颜色渐变???我有一个 donut chart ,它就像一个进度条,显示完成状态。 AMCharts 只允许我为已完成百分比和未完成百分比选择两种颜色。我希望图表的已完成部分填充颜色渐变。它可以在条形图中完成,但我想不出一种方法来处理圆环图。任何帮助,将不胜感激。谢谢。
最佳答案
从 3.18 版开始,amCharts 支持饼图/圆环图上的径向渐变。
要启用它,请使用 gradientRatio
属性(property)。它是一组值。零表示没有变化,负值 - 使颜色更深,正值 - 更亮。
例如这一行:
"gradientRatio": [0, 0, 0 ,-0.2, -0.4]
这意味着渐变将有 5 个步骤。前 3 个步骤将采用切片的原始颜色。 4th 会使它变暗 20%。第 5 - 40% 更暗。
这是一个完整的工作示例:
var chart = AmCharts.makeChart("chartdiv", {
"type": "pie",
"dataProvider": [{
"country": "United States",
"visits": 7252
}, {
"country": "China",
"visits": 3882
}, {
"country": "Japan",
"visits": 1809
}, {
"country": "Germany",
"visits": 1322
}, {
"country": "United Kingdom",
"visits": 1122
}, {
"country": "France",
"visits": 414
}, {
"country": "India",
"visits": 384
}, {
"country": "Spain",
"visits": 211
}],
"valueField": "visits",
"titleField": "country",
"startEffect": "elastic",
"startDuration": 2,
"innerRadius": "40%",
"gradientRatio": [0, 0, 0 ,-0.2, -0.4],
"gradientType": "radial"
});
<script src="http://www.amcharts.com/lib/3/amcharts.js"></script>
<script src="http://www.amcharts.com/lib/3/pie.js"></script>
<div id="chartdiv" style="width: 100%; height: 435px;"></div>
关于javascript - AMCharts Donut Chart颜色渐变定制,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33765109/