This sample demonstrates how to set a JavaScript array as a chart data.



The dvxChart plugin is working with array data. The data is set per series:



var chart = new dvxCharts.Chart({

series: [{ type:'chartType', data: data, ... }, ...]

});



For the most of the different series the chart data is in format:



data : [ [xValue1, yValue1], [xValue2, yValue2], ... ]

// x-values are strings, numeric or date,

// y-values are numeric



or



data : [value1, value2, ...] // x-values are automatically generated strings

// starting at one and increasing by one for each y value in the array



For more information how the different chart types are working with chart data, look at their examples.

<!DOCTYPE html> <html> <head> <title>JavaScript Charts by dvxCharts</title> <link rel="stylesheet" type="text/css" href="../../css/dvxCharts.chart.min.css" /> <link rel="stylesheet" type="text/css" href="../../themes/base/styles.css" /> <script src="../../js/dvxCharts.chart.min.js" type="text/javascript"></script> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"> <style> .example-container { width: 100%; max-width: 500px; height: 300px; } </style> <script lang="javascript" type="text/javascript"> var chart = new dvxCharts.Chart({ title: { text: 'Inline Data' }, animation: { duration: 1 }, series: [ { type: 'column', data: [['A', 33], ['B', 57], ['C', 33], ['D', 12], ['E', 35], ['F', 7], ['G', 24]] } ] }); chart.write('container'); </script> </head> <body> <div> <div id="container" class="example-container"> </div> </div> </body> </html>