Question

我使用JS脚本AMCharts。我用以下代码输出图表：

Codabale

enter image description here

我需要更改列的颜色。我试图指定属性“颜色”和“背景”，但它不起作用。你能帮助我吗？如何正确更改扬声器的颜色？

Answer 1

您可以在图表中设置fillColors属性以更改其背景颜色。

"graphs": [{
    "fillColors": "#CCFF00", 
    // ...
}, {
    // ...
    "fillColors": "#880000", 
    // ...
}],

演示如下：

＆＃13;

var var1 = 10,
  var2 = 20;
var chart1 = AmCharts.makeChart("chartdiv_refinance", {
  "theme": "none",
  "type": "serial",
  "dataProvider": [{
    "type": "text1",
    "label1": var1,
    "label2": var2
  }],
  "valueAxes": [{
    "unit": "text2",
    "position": "left",
    "title": "",
  }],
  "startDuration": 1,
  "graphs": [{
    "balloonText": "text3",
    "fillColors": "#CCFF00",
    "fillAlphas": 0.9,
    "lineAlpha": 0.2,
    "title": "text4",
    "type": "column",
    "valueField": "label1",
  }, {
    "balloonText": "text6",
    "fillColors": "#880000",
    "fillAlphas": 0.9,
    "lineAlpha": 0.2,
    "title": "text7",
    "type": "column",
    "clustered": false,
    "columnWidth": 0.5,
    "valueField": "label2",
  }],
  "plotAreaFillAlphas": 0.1,
  "categoryField": "type",
  "categoryAxis": {
    "gridPosition": "start"
  },
  "export": {
    "enabled": true
  }
});

＆＃13;

#chartdiv_refinance {
  width: 100%;
  height: 300px;
}

＆＃13;

<div id="chartdiv_refinance"></div>
<script src="http://cdn.amcharts.com/lib/3/amcharts.js"></script>
<script src="http://cdn.amcharts.com/lib/3/serial.js"></script>
<script src="http://cdn.amcharts.com/lib/3/pie.js"></script>

＆＃13;

请注意，您的valueField需要与dataProvider属性相匹配。我改变了＃text; text5＆＃34;和＆＃34; text8＆＃34; to＆＃34; label1＆＃34;和＆＃34; label2＆＃34;。

AM图表。如何更改列的背景？

1 个答案: