You must be logged in to post your query.
Home › Forums › Chart Support › Changing colors
Json: [{"region":"SZ m5 00.10.00.49","status":"1"},{"region":"SZ SU 0.00.10.01","status":"1"}]
[{"region":"SZ m5 00.10.00.49","status":"1"},{"region":"SZ SU 0.00.10.01","status":"1"}]
code:
<script type="text/javascript"> $(document).ready(function(){ function sec() { var dataPoints =[]; $.getJSON("api_status.php",function(data) { for(var i=0; i<= data.length-1; i++) { dataPoints.push({label:data[i].region,y:parseInt(data[i].status)}); } var chart = new CanvasJS.Chart("chartContainer", { theme: "theme2", zoomEnabled: true, panEnabled: true, title: { fontSize: 14, text: "TEXT" }, axisY:{ valueFormatString: " ", maximum: 1, gridThickness: 0, }, axisX: { labelMaxWidth: 80, labelWrap: true, }, legend: { itemMaxWidth: 150, itemWrap: true, maxWidth: 100 }, data: [ { type: "column", color: "green", showInLegend: false, dataPoints: dataPoints } ] }); chart.render(); }); } setInterval(sec, 10000) }); </script>
If JSON “status”: “2” (example { “region”: “SZ SU 0.00.10.01”, “status”: “2”}) as a color change on the other?
Dimas,
Yes its possible to set color at dataPoint level. In your case, you can set the color at datapoint level while parsing the JSON data. Please find the code-snippet for the same below.
for (var i = 0; i <= data.length - 1; i++) { var color = null; if (data[i].status != 1) color = "red"; dataPoints.push({ label: data[i].region, y: parseInt(data[i].status), color: color }); }
Please check this JSFiddle for working code.
— Vishwas R Team CanvasJS
Thanks for the help! working
You must be logged in to reply to this topic. Login/Register