我有一个amcharts
条形图如下:
请参考我的小提琴
请检查我的数据我提供的颜色不同但没有
var chartData = [
[
{ "country": "Czech Republic", "litres": 156.90,"color":"#448800"},
{ "country": "Ireland", "litres": 131.10,"color":"#880000"},
{ "country": "Germany", "litres": 115.80,"color":"#ff9900"}
]
]
我需要的是每个酒吧的不同颜色。我该如何使用不同的颜色?
答案 0 :(得分:3)
我的工作实例
var chart;
var chartData = [{
country: "USA",
visits: 4025,
subdata: [
{ country: "New York", visits: 1000 },
{ country: "California", visits: 785 },
{ country: "Florida", visits: 501 },
{ country: "Illinois", visits: 321 },
{ country: "Washington", visits: 101 }
] ,"color":"#EEAA00"},
{
country: "China",
visits: 1882
,"color":"#DDBB00"},
{
country: "Japan",
visits: 1809
,"color":"#CCDD00"},
{
country: "Germany",
visits: 1322
,"color":"#FFEE00"}];
AmCharts.ready(function() {
// SERIAL CHART
chart = new AmCharts.AmSerialChart();
chart.dataProvider = chartData;
chart.categoryField = "country";
chart.startDuration = 1;
// AXES
// category
var categoryAxis = chart.categoryAxis;
categoryAxis.labelRotation = 90;
categoryAxis.gridPosition = "start";
// value
// in case you don't want to change default settings of value axis,
// you don't need to create it, as one value axis is created automatically.
// GRAPH
var graph = new AmCharts.AmGraph();
graph.valueField = "visits";
graph.colorField = "color"
graph.balloonText = "[[category]]: [[value]]";
graph.type = "column";
graph.lineAlpha = 0;
graph.fillAlphas = 0.8;
chart.addGraph(graph);
chart.addListener("clickGraphItem", function (event) {
// let's look if the clicked graph item had any subdata to drill-down into
if (event.item.dataContext.subdata != undefined) {
// wow it has!
// let's set that as chart's dataProvider
event.chart.dataProvider = event.item.dataContext.subdata;
event.chart.validateData();
}
});
chart.write("chartdiv");
});
在你的例子中var chart;
var chartData = [
[
{ "country": "Czech Republic", "litres": 156.90,"color":"#448800"},
{ "country": "Ireland", "litres": 131.10,"color":"#880000"},
{ "country": "Germany", "litres": 115.80,"color":"#ff9900"}
]
]
//AmCharts.ready(function() {
// RADAR CHART
chart = new AmCharts.AmSerialChart();
chart.dataProvider = chartData[0];
chart.categoryField = "country";
chart.startDuration = 3;
chart.sequencedAnimation = false;
// VALUE AXIS
var valueAxis = new AmCharts.ValueAxis();
valueAxis.axisAlpha = 0.15;
valueAxis.minimum = 0;
valueAxis.dashLength = 3;
chart.addValueAxis(valueAxis);
// GRAPH
var graph = new AmCharts.AmGraph();
graph.type = "column";
graph.colorField = "color"
graph.valueField = "litres";
graph.fillAlphas = 0.6;
graph.balloonText = "[[value]] litres of beer per year";
chart.addGraph(graph);
// WRITE
chart.write("chartdiv");
添加graph.colorField =“color”它正在你的小提琴中工作