1 pièce(s) jointe(s)
Highcharts - Libellé - Camembert
Bonjour
Je m'arrache les cheveux pour faire afficher les libellés sur un camembert Highcharts.
Les données sont issues d'une base mysql et j'ai ajouté un menu déroulant qui permet de sélectionner un 'id'.
Ca marche sauf pour les libellés, qui font apparaitre "Slice : XX%"
Pièce jointe 173792
Merci de votre aide
Olivier
Voici le code php :
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24
| //select database
mysql_select_db("hagroupejioli", $con);
$id = $_GET['id'];
$arr = array();
$arr1 = array();
$result = array();
$sql = "select categorie, `2014` from higcharts_data where adherent_id = '$id'";
$q = mysql_query($sql);
$j = 0;
while($row = mysql_fetch_array($q)){
$arr['data'][] = $row['categorie'];
$arr1['data'][] = $row['2014'];
}
array_push($result,$arr1);
print json_encode($result, JSON_NUMERIC_CHECK);
mysql_close($con); |
[HighCharts] Highcharts - Libellé - Camembert
Bonjour
Je suis d'accord avec toi.
La requete sql prend pourtant en compte cette contrainte ['name #1', 100].
Est ce que ca ne viendrait pas du javascript ?
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51
| <script>
$(function () {
//on page load
getAjaxData(1);
//on changing select option
$('#dynamic_data').change(function(){
var val = $('#dynamic_data').val();
getAjaxData(val);
});
function getAjaxData(id){
//use getJSON to get the dynamic data via AJAX call
$.getJSON('data.php', {id: id}, function(chartData) {
$('#container').highcharts({
chart: {
type: 'pie'
},
title: {
text: 'Suivi des consommations par adherent'
},
tooltip: {
formatter: function() {
return '<b>'+ this.point.name +'</b>: '+ this.percentage +' %';
}
},
plotOptions: {
//this need only for pie chart
pie: {
allowPointSelect: true,
cursor: 'pointer',
dataLabels: {
enabled: true,
color: '#000000',
connectorColor: '#000000',
formatter: function() {
return '<b>'+ this.point.name +'</b>: '+ this.percentage +' %';
}
}
}
},
series: chartData
});
});
}
});
</script> |
Merci de ton retour
A+