2013-08-07 4 views
1

.highcharts JSON 구글 어스

차트는 동적이며 실시간으로 제공됩니다.

내 연구에서 나는 내가 JSON에게 HTML 파일을 사전 처리에 서버의 PHP 스크립트에서 촬영 및 전송 형식의 데이터를 사용하여 할 수있는 것을 발견했다.

가 나는 장소 팝업 내부의 HTML 코드 (highcharts.html)를 넣고, 서버에 상주하는 retrieve_data.php 파일을 참조.

(당신이 HTML 코드 내에서 참조하는 PHP 스크립트의 주소를 액세스하는 경우 당신이 그들을 볼 수 있습니다) PHP 파일이 성공적으로 더미 데이터를 가져 오는 있습니다 그래서 JSON 인코딩 작업이 완료 것으로 보인다.

것은 이제 마지막으로

I는 서버와의 통신에 뭔가를 놓치고 .... 구글 어스 장소 (또는를 가져 오기 위해 구글 어스 장소)에 그들을 보내는 방법 또는 내가 뭔가를 할 잘못된??

참고 : 이것은 JSON 데이터 전송에 처음 문의 한 것입니다.

다음은 내가 사용하는 파일입니다.

당신의 도움이

<!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> 

------------ 및 PHP 파일 --------- 사전에 여러분 모두 감사합니다

<?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); 
?> 

답변

1

문제는이 URL은 (적어도 나를 위해) 적절한 하나입니다입니다 : http://diss.web44.net/retrieve_data.php

이 그리고 당신의 JSON 예를 들어, 문자열로 모든 숫자가 있습니다 ["Direct Sales","20.00"] - nuber해야합니다 동안> 20.00, 문자열입니다. 그 번호를 변경하고 잘 작동합니다.

+0

안녕하세요 Pawel, 답변 해 주셔서 감사합니다. 바로 현장에있었습니다. PHP 버전 5.3.3 이상을 설치하여 작동하도록했습니다. Google 어스 위치 표시 안에 동일한 코드를 전송하면 아무 것도 표시되지 않습니다. 내가해야만하는 뭔가가 있니? –

+0

그 링크에서 : http://diss.web44.net/retrieve_data.php 나는 아직도 숫자의 문자열을 볼 수 있습니다. 콘솔에 오류가 있습니까? –

+0

나는이 URL을 버리고 정직하게 지냈다. 이제는 내 서버에서 호스팅합니다. 위에서 가장 많이 설명한 것은 GoogleEarth와 관련이있을 것입니다. GE의 외부는 완벽하게 작동합니다. 하이 차트 HTML 파일을 가리키는 링크가있는 경우에만 그래프 내부를 볼 수 있습니다. 그리고 GE와 같은 그래프를 브라우저와 같이 표시합니다. –

관련 문제