Apresentar DOIS gráficos Highcharts no mesmo formulário
Pessoal, preciso de uma orientação.
Gerei um gráfico HIGHCHARTS, que obtem as informações da base, até ai perfeito.
Mas quando quero na mesma página apresentar ou grafico de estilo diferente para dados da base diferentes os graficos não são mais apresentados.
Tentei mudar o nome da DIV que o gráfico é apresentado mas mesmo assim não exibe os gráficos.
Alguém sabe o que posso fazer para exibir os dois ou mais gráficos na mesma página?
exemplo do meu gráfico 01 :
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Highcharts Example</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<style type="text/css">${demo.css}
</style>
<script type="text/javascript">
<?php
$perct_sprint = $_GET["perct_sprint"];
?>
$(function () {
$('#container2').highcharts({
chart2: {
type: 'bar'
},
title: {
text: 'Historic World Population by Region'
},
subtitle: {
text: 'Source: Wikipedia.org'
},
xAxis: {
categories: ['Africa', 'America', 'Asia', 'Europe', 'Oceania'],
title: {
text: null
}
},
yAxis: {
min: 0,
title: {
text: 'Population (millions)',
align: 'high'
},
labels: {
overflow: 'justify'
}
},
tooltip: {
valueSuffix: ' millions'
},
plotOptions: {
bar: {
dataLabels: {
enabled: true
}
}
},
legend: {
layout: 'vertical',
align: 'right',
verticalAlign: 'top',
x: -40,
y: 100,
floating: true,
borderWidth: 1,
backgroundColor: ((Highcharts.theme && Highcharts.theme.legendBackgroundColor) || '#FFFFFF'),
shadow: true
},
credits: {
enabled: false
},
series: [
{
name: 'Year 1800',
data: [ <?php echo $perct_sprint; ?>,635, 203, 2]
},
]
});
});
</script>
</head>
<body>
<script src="grafico/js/highcharts.js"></script>
<script src="grafico/js/highcharts-3d.js"></script>
<script src="grafico/js/modules/exporting.js"></script>
<div id="container2" style="min-width: 310px; max-width: 400px; height: 200px; margin: 0 auto"></div>
</body>
</html>Discussão (2)
Carregando comentários...