您好我想在页面中设置多个高图表主题 我有4张图表。我想要 图表1:默认主题
图表2:沙子主题
图表3:黑色主题
图表4:grid_light
我已经从this问题尝试过了 但我的图表主题不会改变。
代码grid_light.js http://pastebin.com/TgpJutZ8
<script>
//Chart 1
$(function () {
$('#chart1').highcharts({
title: {
text: 'Total Kunjungan Per Bulan',
x: -20 //center
},
xAxis: {
categories: ['Januari', 'Februari', 'Maret', 'April', 'Mei', 'Juni',
'Juli', 'Agustus', 'September', 'Oktober', 'November', 'Desember']
},
yAxis: {
title: {
text: 'Total Kunjungan Per Bulan'
},
tickInterval: 1,
plotLines: [{
value: 0,
width: 1,
color: '#808080'
}]
}, tooltip:{
formatter:function(){
console.log(this);
return this.key + ' : ' + this.y + ' Kunjungan';
}
},
series: [{
name: '<?php echo $hasil->nama_sekolah?>',
data: [
<?php
$years = date("Y");
$data_ds = mysql_query("SELECT count(*) as hitung FROM `sekolah_kunjungan` where kode='$hasil->kode' and tahun_kunjungan='$years' group by bulan_kunjungan");
while ($ds=mysql_fetch_object($data_ds)) {
echo "".$ds->hitung.",";
}
?>
]
}]
});
});
</script>
<script>
//Chart 2
$(function () {
$('#chart2').highcharts({
chart: {
type: 'column'
},
title: {
text: 'Jumlah Pengunjung Per Tahun'
},
yAxis: {
min: 0,
labels: {
format: '{value:.y:,.0f}'
},
title: {
text: 'Kunjungan / Tahun'
},
tickInterval: 1
},
tooltip: {
headerFormat: '<table>',
pointFormat: '<tr><td style="color:{series.color};padding:0">{series.name}: </td>' +
'<td style="padding:0"><b>{point.y} Kunjungan/Tahun</b></td></tr>',
footerFormat: '</table>',
shared: true,
useHTML: true,
},
plotOptions: {
column: {
pointPadding: 0.2,
borderWidth: 0
}
},
series: [
<?php
$data_th = mysql_query("SELECT count( id_kunjungan ) AS hitung, tahun_kunjungan FROM sekolah_kunjungan where kode='$hasil->kode' group by tahun_kunjungan");
while ($th=mysql_fetch_object($data_th)) {
?>{
name: '<?php echo $th->tahun_kunjungan ?>',
data: [<?php echo $th->hitung ?>]
},
<?php }?>
]
});
});
</script>
<script>
//Chart 3
$(function () {
$('#chart3').highcharts({
chart: {
plotBackgroundColor: null,
plotBorderWidth: null,
plotShadow: false
},
title: {
text: 'Jumlah Pendaftar Berdasarkan Jenis Kelamin'
},
tooltip: {
pointFormat: '{series.name}: <b>{point.y}</b>'
},
plotOptions: {
pie: {
allowPointSelect: true,
cursor: 'pointer',
dataLabels: {
enabled: true,
format: '<b>{point.name}</b>: {point.y}',
style: {
color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black'
}
}
}
},
series: [{
type: 'pie',
name: 'Total',
data: [
<?php
$data_jk = mysql_query("SELECT count(id_daftar) as hitung,jenis FROM sekolah_daftar where kode='$hasil->kode' group by jenis");
while ($jk=mysql_fetch_object($data_jk)) {
?>
['<?php echo $jk->jenis?>', <?php echo $jk->hitung ?>],
<?php } ?>
]
}]
});
});
</script>
<script>
//Chart 4
$(function () {
$('#chart4').highcharts({
chart: {
type: 'column'
},
title: {
text: 'Jumlah Pendaftar Pertahun Ajaran'
},
yAxis: {
min: 0,
labels: {
format: '{value:.y:,.0f}'
},
title: {
text: 'Pendaftar / Tahun'
},
tickInterval: 1
},
tooltip: {
headerFormat: '<table>',
pointFormat: '<tr><td style="color:{series.color};padding:0">{series.name}: </td>' +
'<td style="padding:0"><b>{point.y} Pendaftar/Tahun</b></td></tr>',
footerFormat: '</table>',
shared: true,
useHTML: true,
},
plotOptions: {
column: {
pointPadding: 0.2,
borderWidth: 0
}
},
series: [
<?php
$data_th = mysql_query("SELECT count( id_daftar ) AS hitung, tahun_kunjungan FROM sekolah_daftar where kode='$hasil->kode' group by tahun_kunjungan");
while ($th=mysql_fetch_object($data_th)) {
?>{
name: '<?php echo $th->tahun_kunjungan ?>',
data: [<?php echo $th->hitung ?>]
},
<?php }?>
]
});
});
</script>
谢谢:)