FusionCharts - CRS label
Created using FusionCharts Suite XT - www.fusioncharts.com
by Saneesh K V
HTML
<script src="https://cdn.fusioncharts.com/fusioncharts/latest/fusioncharts.js"></script>
<div id="container">FusionCharts will render here</div>
JavaScript
var data = [
[ "1/7/2020", "Completed", 13 ],
[ "1/7/2020", "Partial", 1 ],
[ "1/7/2020", "Error", 3 ],
[ "2/7/2020", "Completed", 13 ],
[ "2/7/2020", "Partial", 1 ],
[ "2/7/2020", "Error", 3 ],
[ "3/7/2020", "Completed", 13 ],
[ "3/7/2020", "Partial", 1 ],
[ "3/7/2020", "Error", 3 ],
[ "4/7/2020", "Completed", 13 ],
[ "4/7/2020", "Partial", 1 ],
[ "4/7/2020", "Error", 3 ],
[ "5/7/2020", "Completed", 13 ],
[ "5/7/2020", "Partial", 1 ],
[ "5/7/2020", "Error", 3 ],
[ "6/7/2020", "Completed", 13 ],
[ "6/7/2020", "Partial", 1 ],
[ "6/7/2020", "Error", 3 ],
[ "7/7/2020", "Completed", 13 ],
[ "7/7/2020", "Partial", 1 ],
[ "7/7/2020", "Error", 3 ],
[ "8/7/2020", "Completed", 13 ],
[ "8/7/2020", "Partial", 1 ],
[ "8/7/2020", "Error", 3 ],
];
var schema = [
{
name: "Date",
type: "date",
// 3/10/2004 18:00:00
"format": "%d/%m/%Y"
},
{
name: "Status",
type: "string"
},
{
name: "Jobs",
type: "number"
}
];
var dataStore = new FusionCharts.DataStore();
new FusionCharts({
type: 'timeseries',
renderAt: 'container',
width: "100%",
height: 400,
dataSource: {
chart: { paletteColors: "#7FB03D,#FF8D3C,#F0353B" },
navigator: {
enabled: false
},
extensions: {
customRangeSelector: {
enabled: false //Enable or diable the custom range selector (calendar)
},
standardrangeselector: {
style: {
"button-text:active": {
fill: "#003B62"
},
separator: {
"stroke-width": "0"
}
}
}
},
series: "Status",
yaxis: [
{
plot: [
{
value: "Jobs",
type:...