Latest web development tutorials

grafik logaritmik Highcharts

grafik Highcharts grafik Highcharts

Contoh berikut menunjukkan grafik logaritmik.

Pada bagian sebelumnya kita sudah tahu sintaks konfigurasi Highcharts. Mari kita lihat bagaimana mengkonfigurasi.

konfigurasi

YAxis.type dikonfigurasi sebagai 'logaritmik'. Mendefinisikan jenis x-axis. nilai-nilai opsional "linear", "logaritma", "datetime" atau "kategori". Nilai default adalah linear. 

yAxis
var yAxis = {
   type: 'logarithmic',
   minorTickInterval: 0.1
};

contoh

File name: highcharts_line_logarithmic.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: '对数实例(w3big.com)'   
   };
   var xAxis = {
      tickInterval: 1
   };
   var yAxis = {
      type: 'logarithmic',
      minorTickInterval: 0.1
   };
   var tooltip = {
      headerFormat: '<b>{series.name}</b><br>',
      pointFormat: 'x = {point.x}, y = {point.y}'
   };
   var plotOptions = {
      spline: {
         marker: {
            enabled: true
         }
      }
   };
   var series= [{
         name: 'data',
         data: [1, 2, 4, 8, 16, 32, 64, 128, 256, 512],
         pointStart: 1
      }
   ];     
      
   var json = {};   
   json.title = title;   
   json.tooltip = tooltip;
   json.xAxis = xAxis;
   json.yAxis = yAxis;  
   json.series = series;
   json.plotOptions = plotOptions;
   $('#container').highcharts(json);
  
});
</script>
</body>
</html>

Contoh di atas output:

grafik Highcharts grafik Highcharts