Ajout d'une ligne de régression à un diagramme de dispersion Highcharts

Graphique combiné

L'exemple suivant montre comment ajouter une ligne de régression à un diagramme de dispersion.

Nous avons déjà appris la syntaxe de configuration de base de Highcharts dans les chapitres précédents. Examinons maintenant d'autres configurations.

Configuration

Configuration de series

Définissez la propriété type de series sur line/scatter. series.type décrit le type de série de données. La valeur par défaut est "line".

var series = {
   type: 'scatter'
};

Exemple

Nom du fichier : highcharts_combinations_scatter.htm

<html>
<head>
<meta charset="UTF-8" />
<title>Highcharts 教程 | Example(example.com)</title>
<script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
<script src="http://code.highcharts.com/highcharts.js"></script>
</head>
<body>
<div id="container" style="width: 550px; height: 400px; margin: 0 auto"></div>
<script language="JavaScript">
$(document).ready(function() {  
   var title = {
      text: '散点图上添加回归线'   
   };
   var xAxis = {
      min: -0.5,
      max: 5.5
   };
   var yAxis= {
      min: 0
   };
   var series= [{
            type: 'line',
            name: '回归线',
            data: [[0, 1.11], [5, 4.51]],
            marker: {
                enabled: false
            },
            states: {
                hover: {
                    lineWidth: 0
                }
            },
            enableMouseTracking: false
        }, {
            type: 'scatter',
            name: '观察点',
            data: [1, 1.5, 2.8, 3.5, 3.9, 4.2],
            marker: {
                radius: 4
            }
        }
   ];     
      
   var json = {};   
   json.title = title;
   json.xAxis = xAxis;
   json.yAxis = yAxis;
   json.series = series;
   $('#container').highcharts(json);  
});
</script>
</body>
</html>

Essayez-le vous-même »

Le résultat de sortie de l'exemple ci-dessus est :

Graphique combiné