{"id":6040,"date":"2018-05-29T07:20:23","date_gmt":"2018-05-29T07:20:23","guid":{"rendered":"https:\/\/www.anychart.com\/blog\/?p=6040"},"modified":"2018-05-29T07:16:11","modified_gmt":"2018-05-29T07:16:11","slug":"regression-analysis-anychart-javascript-charts","status":"publish","type":"post","link":"https:\/\/www.anychart.com\/blog\/2018\/05\/29\/regression-analysis-anychart-javascript-charts\/","title":{"rendered":"Regression Analysis in AnyChart JavaScript Charts"},"content":{"rendered":"

\"Regression
\nAnyChart<\/a> is not only a beautiful charting library but also a multifunctional one. We\u2019ve got lots of questions from our customers on how they can integrate regression analysis into AnyChart JavaScript Charts. There are many approaches that may be adopted in order to interpolate and approximate data. And the one we’re going to share with you today involves the use of the popular regression.js<\/a> library along with AnyChart.<\/p>\n

<\/p>\n

What Is Regression.js<\/h2>\n

Regression.js is a JavaScript module containing a collection of linear least-squares fitting methods for simple data analysis. It can be used for data approximation, finding data regularities and so on. It is available as the ‘regression’ package on npm<\/a> and on the cdnjs CDN<\/a>.<\/p>\n

To work with library, either plug it into your page from its CDN link<\/a>, download the file and place it on your server, or, follow the instructions given in regression.js repository on GitHub<\/a> to use it with Node.js.<\/p>\n

Visualizing Regression Analysis<\/h2>\n

Now let\u2019s find out how to create an interactive JavaScript chart along with the regression.js library.<\/p>\n

If the regression.js is properly added to a page, we can use some data to get the regression object of a, say, linear type, and get the coefficients:<\/p>\n

var rawData = [\r\n  [0.1, 2.1],\r\n  [1, 2.4],\r\n  [2, 2.6],\r\n  [4, 2.8],\r\n  [5, 3]\r\n];\r\n\r\nvar result = regression('linear', rawData);\r\nvar coeff = result.equation;\r\n<\/code><\/pre>\n
To set theoretical data, we use the function that will generate another data array:<\/p>\n
function setTheoryData(rawData) {\r\n  var theoryData = [];\r\n  for (var i = 0; i < rawData.length; i++) {\r\n    theoryData[i] = [rawData[i][0], formula(coeff, rawData[i][0])];\r\n  }\r\n  return theoryData;\r\n}\r\n<\/code><\/pre>\n
Having done that, we input X values and calculate Y values using the formula found:<\/p>\n
function formula(coeff, x) {\r\n  var result = null;\r\n  for (var i = 0, j = coeff.length - 1; i < coeff.length; i++, j--) {\r\n    result += coeff[i] * Math.pow(x, j);\r\n  }\r\n  return result;\r\n}\r\n<\/code><\/pre>\n
When the data is ready all we have to do is to display it as a series on a chart.<\/p>\n
And that\u2019s how AnyChart-Regression.js sample looks like, you can fork and edit it, or download it from AnyChart Playground<\/a>:<\/p>\n