Latest web development tutorials

Highcharts scatterplot sur la ligne de régression

Highcharts graphique combiné Highcharts graphique combiné

L'exemple suivant illustre la ligne de régression sur le diagramme de dispersion.

Dans la section précédente, nous savons déjà Highcharts syntaxe de configuration de base. Regardons les autres configurations.

configuration

configuration en série

L'attribut type est défini ligne série / scatter, colonne series.type décrit le type de données. La valeur par défaut est "en ligne". 

var series = {
   type: 'scatter'
};

Exemples

Nom du fichier: highcharts_combinations_scatter.htm 

<html>
<head>
<meta charset="UTF-8" />
<title>Highcharts 教程 | 本教程(w3big.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>

L'exemple ci-dessus sortie est:

Highcharts graphique combiné Highcharts graphique combiné