sunman
sunman

Reputation: 79

Highcharts issues in [object Object]:0.0 for pie chart

I am a new to Highcharts and json and I'm using the pie chart with gradient fill. I have been facing issues for the past few days with extracting in json data from php and mysql to populate a pie chart with gradient fill using the Highchart library. I have already tried all the suggestions of StackOverflow and Google search though I'm unable to find a particular solution for this.My Pie chart shows me [object Object]:0.0 , not shows proper graph.pie imageenter image description here

Please tell why i m getting this error.My code is in below.

    $(function () {

     // Radialize the colors
     Highcharts.getOptions().colors = Highcharts.map(Highcharts.getOptions().colors,   function(color) {
      return {
         radialGradient: { cx: 0.5, cy: 0.3, r: 0.7 },
        stops: [
            [0, color],
            [1, Highcharts.Color(color).brighten(-0.3).get('rgb')] // darken
        ]
    };
});

// Build the chart
$('#container').highcharts({
    chart: {
        plotBackgroundColor: null,
        plotBorderWidth: null,
        plotShadow: false
    },
    title: {
        text: ' Rate of a specific project'
    },
    tooltip: {
        pointFormat: '{series.name}: <b>{point.percentage:.1f}</b>'
    },
    plotOptions: {
        pie: {
            allowPointSelect: true,
            cursor: 'pointer',
            dataLabels: {
                enabled: true,
                format: '<b>{point.name}</b>: {point.percentage:.1f}',
                style: {
                    color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black'
                },
                connectorColor: 'silver'
            }
        }
    },
    series: [{
        type: 'pie',
        name: 'Total Marketing',
        data:[]

    }]
   });
    $.getJSON("data.php", function(data){

    //options.series[0].data = json;
        chart.series[0].setData(data);

       chart = new Highcharts.Chart(options);

    });
   });

Here is data.php

  $sql="SELECT mozila,ie,chrome,opera,safari,torch FROM webmarketing";
   $resultSql = mysql_query($sql);
   $result = array();
  while($rows=mysql_fetch_array($resultSql)) {
  $result[] = array('name' => 'MOZILA', 'y' => $rows['mozila']);
  $result[] = array('name' => 'IE', 'y' => $rows['ie']);
  $result[] = array('name' => 'CHROME', 'y' => $rows['chrome']);
     $result[] = array('name' => 'OPERA', 'y' => $rows['opera']);
   $result[] = array('name' => 'OTHERS', 'y' => $rows['safari']+$rows['torch']);
   }
   print json_encode($result, JSON_NUMERIC_CHECK);

json looks like

    [{"name":{"MOZILA":45.0}},{"name":{"IE":26.8}},{"name":{"CHROME":12.8}},{"name":   {"OPERA":6.2}},{"name":{"OTHERS":9.2}}]

Please give me solution.

Upvotes: 0

Views: 1131

Answers (1)

wergeld
wergeld

Reputation: 14442

Based on your comment your JSON is wrong. Highcharts expects data to look like:

[val1, val2, val3,...,valN]

Or

[{"name1", val1},{"name2", val2},{"name3", val3},...,{"nameN", valN}]

Or

[{name: "name1", y: val1},{name: "name2", y: val2},{name: "name3", y: val3},...,{name: "nameN", y: valN}]

You need to adjust your JSON builder to output one of those formats. For PIE charts I recommend the {"name1", val1} version.

Upvotes: 1

Related Questions