JSFiddle - React, Tailwind, and code Playground
by phpepe
HTML
<script src="http://code.highcharts.com/highcharts.js"></script><script src="http://code.highcharts.com/modules/exporting.js"></script>
<script src="//rawgithub.com/phpepe/highcharts-regression/master/highcharts-regression.js"> </script>
<h1> Linear Regresion </h1>
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
JavaScript
$(function () {
$('#container').highcharts({
chart: {
type: 'scatter',
zoomType: 'xy'
},
title: {
text: 'Inflación VS Emisión Monetaria'
},
xAxis: {
title: {
enabled: true,
text: 'Emisión'
},
startOnTick: true,
endOnTick: true,
showLastLabel: true
},
yAxis: {
title: {
text: 'Inflacion'
}
},
legend: {
layout: 'vertical',
align: 'left',
verticalAlign: 'top',
x: 100,
y: 70,
floating: true,
backgroundColor: '#FFFFFF',
borderWidth: 1
},
plotOptions: {
scatter: {
marker: {
radius: 5,
states: {
hover: {
enabled: true,
lineColor: 'rgb(100,100,100)'
}
}
},
states: {
hover: {
marker: {
enabled: false
}
}
},
tooltip: {
headerFormat: '<b>{series.name}</b><br>',
pointFormat: '{point.x}, {point.y}'
}
}
},
series: [{
regression: true ,
regressionSettings: {
type: 'linear',
color: 'rgba(45, 83, 83, .9)',
legend: "%eq",
name: "%eq | r2: %r"
...