2016-10-23 4 views
1

Google 시각화 쿼리를 Google 차트 API를 사용하여 차트로 변환하려고합니다.Google 시각화 쿼리를 차트로 변환하는 방법은 무엇입니까?

내가 현재의 데이터를 가지고 : 나는 차트에이를 켜려고하지만 난 운을받지 못했습니다 https://www.google.com/trends/fetchComponent?hl=en-US&q=battlefield%201&cid=TIMESERIES_GRAPH_0&export=3&w=500&h=300&gprop=youtube&date=today%201-m

, 내가 뭘 해봤 것은 :

<!DOCTYPE html> 
<html> 
<head> 
    <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script> 
    <script> 

    google.charts.load('current', {'packages':['corechart']}); 

     // Set a callback to run when the Google Visualization API is loaded. 
     google.charts.setOnLoadCallback(drawChart); 

     // Callback that creates and populates a data table, 
     // instantiates the pie chart, passes in the data and 
     // draws it. 
     function drawChart() { 

     // Create the data table. 
     var data = new google.visualization.Query('https://www.google.com/trends/fetchComponent?hl=en-US&q=battlefield%201&cid=TIMESERIES_GRAPH_0&export=3&w=500&h=300&gprop=youtube&date=today%201-m'); 

     // Instantiate and draw our chart, passing in some options. 
     var chart = new google.visualization.PieChart(document.getElementById('chart_div')); 
     chart.draw(data, options); 
     } 

    </script> 
</head> 
<body> 
    <div id="chart_div"></div> 
</body> 
</html> 

I 이 차트에 내가 가지고있는 데이터를 전환되지 않는 이유를 볼 수없는 블로그는, 어떤 도움을 크게

을 감사

답변

1

첫째, 응답 데이터를 쿼리를 보내고받을 필요가

다음, 파이 차트를 그릴, 첫 번째 열은

문자열로 첫 번째 열을 변환하는 데이터보기를 사용하여 작업 조각을, 다음을 참조 문자열을 ...해야

google.charts.load('current', {'packages':['corechart']}); 
 
google.charts.setOnLoadCallback(drawChart); 
 

 
function drawChart() { 
 
    var query = new google.visualization.Query('https://www.google.com/trends/fetchComponent?hl=en-US&q=battlefield%201&cid=TIMESERIES_GRAPH_0&export=3&w=500&h=300&gprop=youtube&date=today%201-m'); 
 
    query.send(function (response) { 
 
    if (response.isError()) { 
 
     alert('Error in query: ' + response.getMessage() + ' - ' + response.getDetailedMessage()); 
 
     return; 
 
    } 
 
    data = response.getDataTable(); 
 
    var view = new google.visualization.DataView(data); 
 
    view.setColumns([{ 
 
     calc: function (data, row) { 
 
     return data.getFormattedValue(row, 0); 
 
     }, 
 
     type: 'string', 
 
     label: data.getColumnLabel(0) 
 
    }, 1]); 
 
    var chart = new google.visualization.PieChart(document.getElementById('chart_div')); 
 
    chart.draw(view, { 
 
     chartArea: { 
 
     height: '100%', 
 
     width: '100%' 
 
     }, 
 
     height: 400 
 
    }); 
 
    }); 
 
}
<script src="https://www.gstatic.com/charts/loader.js"></script> 
 
<div id="chart_div"></div>

+0

놀라운 감사합니다! :) – ConorReidd

관련 문제