# Scatter with Regression Line Chart Tutorial

Today, We want to share with you Scatter with Regression Line Chart Tutorial.In this post we will show you Highcharts scatter chart with regression line example, hear for How to create scatter chart with regression line using higcharts we will give you demo and example for implement.In this post, we will learn about Scatter Plot with Regression Line and X-axis with an example.

Free Live Chat for Any Issue

## Scatter with Regression Line Chart Tutorial

Contents

There are the Following The simple About Scatters Charts with Regression Line Full Information With Example and source code.

As I will cover this Post with live Working example to develop highchart multiple charts, so the multiple line chart highcharts is used for this example is following below.

Also Read This π   Waterfall Chart Tutorial With Examples and Demo

### Highcharts Scatter with Regression Line Chart Example

index.html

Angular is a platform for building mobile & desktop web Based user friendly and light weight applications.Angular,It’s TypeScript-based open-source Angularjs web application framework.

<!DOCTYPE html>
<html lang="en">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Highcharts - Scatter with regression line Chart - www.pakainfo.com</title>
<script src="https://www.pakainfo.com/jquery/js/jquery-1.12.4.js"></script>
<script src="https://www.pakainfo.com/jquery/js/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>
<script type="text/javascript">
\$(function () {
var graphTitle = {
text: 'Scatter plot with regression line'
}
var graphxaxis = {
min: -0.5,
max: 5.5
}
var graphyaxis = {
min: 0
}
var graphseries = [{
type: 'line',
name: 'Regression Line',
data: [[0, 1.11], [5, 4.51]],
marker: {
enabled: false
},
states: {
hover: {
lineWidth: 0
}
},
enableMouseTracking: false
}, {
type: 'scatter',
name: 'Observations',
data: [1, 1.5, 2.8, 3.5, 3.9, 4.2],
marker: {
}
}]
\$('#chart-full-content').highcharts({
title: graphTitle,
xAxis: graphxaxis,
yAxis:graphyaxis,
series: graphseries
});
});
</script>
<body>
<div id="chart-full-content" style="min-width: 335px; height: 425px; margin: 0 auto"></div>
</body>
</html>