highcharts JSON google earth

StackOverflow https://stackoverflow.com/questions/18111807

Question

I would like to show a pie chart (using Highcharts library) inside a placemark's popup box (google earth desktop) from data taken from a mysql database residing on a live server.

The chart is intended to be dynamic and realtime.

From my research I found that I can do it using JSON formatted data taken from a php script in the server and sent to the HTML file pre-processed.

I put the html code (highcharts.html) inside the placemark popup and it refers to the retrieve_data.php file residing in the server .

The php file is fetching successfully the dummy data (if you access the address of the php script referenced inside the html code you can see them) so it seems that the JSON encoding is done.

The thing now is how to finally send them at the Google earth placemark (or the Google earth placemark to fetch them)....

Am I missing something in the communication with the server or I do something wrong??

note: this is my first contact with JSON data transfer!

Below are the files that i use.

Thank you all in advance for your help

<!DOCTYPE html>
<html lang="en">
    <head>
    <meta charset="utf-8" />

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>

        <script>
        $(document).ready(function() {
            var options = {
                chart: {
                    renderTo: 'container',
                    plotBackgroundColor: null,
                    plotBorderWidth: null,
                    plotShadow: false
                },
                title: {
                    text: 'gjcgjcgjcgjj'
                },
                tooltip: {
                    formatter: function() {
                        return '<b>'+ this.point.name +'</b>: '+ this.percentage +' %';
                    }
                },
                plotOptions: {
                    pie: {
                        allowPointSelect: true,
                        cursor: 'pointer',
                        dataLabels: {
                            enabled: true,
                            color: '#000000',
                            connectorColor: '#000000',
                            formatter: function() {
                                return '<b>'+ this.point.name +'</b>: '+ this.percentage +' %';
                            }
                        }
                    }
                },
                series: [{
                    type: 'pie',
                    name: 'Browser share',
                    data: []
                }]
            }

<!-- maybe the correct file address is http://diss.web44.net/retrieve_data.php -->
                $.getJSON("http://diss.web44.net/home/a1964573/public_html/retrieve_data.php", function(json) {
                options.series[0].data = json;
                chart = new Highcharts.Chart(options);
            });



        });   
        </script>


        <script src="http://code.highcharts.com/highcharts.js"></script>
        <script src="http://code.highcharts.com/modules/exporting.js"></script>
    </head>

    <body>
        <div id="container" style="min-width: 400px; height: 400px; margin: 0 auto"></div>
    </body>

</html>

------------and the php file---------

<?php

$hostname = "host";
$username = "user";
$pass     = "pass";
$db       = "awesomedb";

$connection = mysql_connect($hostname,$username,$pass);

if (!$connection) 
{
  die('Could not connect: ' . mysql_error());
}

mysql_select_db($db, $connection);

$result = mysql_query("SELECT sensorID,temp FROM ccdata");

$rows = array();
while($r = mysql_fetch_array($result)) {
    $row[0] = $r[0];
    $row[1] = $r[1];
    array_push($rows,$row);
}

print json_encode($rows, JSON_NUMERIC_CHECK);

mysql_close($connection);
?>
Était-ce utile?

La solution

The problem is that this URL is proper one (at least for me): http://diss.web44.net/retrieve_data.php

And your JSON has all numbers as strings, for example: ["Direct Sales","20.00"] -> 20.00 is a string, while should be nuber. Change that to get numbers and will work fine.

Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top