Generating Issues in Export JSON Data to Pie with gradient fill in Highcharts [closed]

Question

Closed. This question needs details or clarity. It is not currently accepting answers.

---

Want to improve this question? Add details and clarify the problem by editing this post.

Closed 9 years ago.

Improve this question

I am creating one Pie with gradient fill Chart from Highcharts using json,php and mysql query.Debug through firebug console but no errors and also graph not display.I creating a static graph [link] http://jsfiddle.net/sunman/YKE2P/10/ like this i want to create this with dynamic with json and mysql.Here is my problem my json data not generate graph.Below is my code.My json data displays like :

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

index.php:

$(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 without cost',
            data:[]

        }]
      });
      $.getJSON("data.php", function(json) {
          //options.series.push(data);
                    options.series[0].data = json;
          chart = new Highcharts.Chart(options);

      });
 });

data.php:

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

So request you to please help where is my code is wrong. I want link this type of graph but with dynamic.I am unaware of json code . So Kindly request to you suggest me of question.

Answer 1

The problem is here:

  $.getJSON("data.php", function(json) {
    options.series.push(data);
    chart = new Highcharts.Chart(options);
  });

You are adding new series, which has some strange format.. I advice to use that instead:

  $.getJSON("data.php", function(json) {
    options.series[0].data = json;
    chart = new Highcharts.Chart(options);
  });