2014-12-30 2 views
0

이 코드는 XML 파일에서 데이터를 가져옵니다. 현재 배열에있는 Google 차트에 이러한 데이터를 제공해야합니다. 내 xml 값을 Google 차트에 전달해야합니다. 누구든지이 사실을 알 수있게 도와 줄 수 있습니까? 아래는 내 코드입니다.한 함수에서 다른 함수로 배열 전달

<!DOCTYPE html> 
<html> 
<head> 

<script type="text/javascript" src="https://code.jquery.com/jquery-2.1.3.js"></script> 

<script type="text/javascript" src="https://www.google.com/jsapi"></script> 
<script type="text/javascript"> 

    google.load("visualization", "1", {packages:["corechart"]}); 
    google.setOnLoadCallback(drawChart); 

    var values = []; 

    $(document).ready(function() { 
     $.ajax({ 
      type: "GET", 
      url: "ChartData.xml", 
      dataType: "xml", 
      success: function(xml) { 
       $(xml).find('Pie').each(function() { 
        var sTitle = $(this).find('Title').text(); 
        var sValue = $(this).find('Value').text(); 
        values.push([sTitle, sValue]); 
       }); 
       drawChart(values); 
      }, 
      error: function() { 
       alert("An error occurred while processing XML file."); 
      } 
     }); 
    }); 

    function drawChart(val) { 
    alert(val); 
     var data = google.visualization.arrayToDataTable([ 
      ['Task', 'Hours per Day'], 
      ['Work',  11], 
      ['Eat',  2], 
      ['Commute', 2], 
      ['Watch TV', 2], 
      ['Sleep', 7] 
     ]); 

     var options = { 
      title: 'My Daily Activities' 
     }; 

     var chart = new google.visualization.PieChart(document.getElementById('piechart')); 

     chart.draw(data, options); 
    } 
</script> 

<title>My Read</title> 
</head> 

<body> 
<div id="piechart" style="width: 900px; height: 500px;"></div> 
</body> 
</html> 

당신은으로 drawChart() 기능에 해당 배열을 통과

<?xml version="1.0" encoding="utf-8" ?> 
    <Chart> 
     <Pie> 
     <Title>Task</Title> 
     <Value>Hours per Day</Value> 
     </Pie> 
     <Pie> 
     <Title>Work</Title> 
     <Value>11</Value> 
     </Pie> 
     <Pie> 
     <Title>Eat</Title> 
     <Value>2</Value> 
     </Pie> 
     <Pie> 
     <Title>Commute</Title> 
     <Value>2</Value> 
     </Pie> 
     <Pie> 
     <Title>Watch TV</Title> 
     <Value>2</Value> 
     </Pie> 
     <Pie> 
     <Title>Sleep</Title> 
     <Value>7</Value> 
     </Pie> 
    </Chart> 
+0

당신은 * 배열을'drawChart' 함수의 값으로 전달하고 있습니다 만, 그 안에 아무 것도 사용하지 않습니다. 'google.visualization.arrayToDataTable (val)' – Justinas

+0

예 google.visualization.arrayToDataTable (val)에서 사용하는 방법을 모르겠다. – user3689990

+0

어떻게하는지 보여 줄 수 있습니까? 감사합니다 – user3689990

답변

1

변경이

var data = google.visualization.arrayToDataTable([ 
      ['Task', 'Hours per Day'], 
      ['Work',  11], 
      ['Eat',  2], 
      ['Commute', 2], 
      ['Watch TV', 2], 
      ['Sleep', 7] 
     ]); 

var data = google.visualization.arrayToDataTable((Array.isArray(val) && val.length) ? val : [ 
    ['Task', 'Hours per Day'], 
    ['Work',  11], 
    ['Eat',  2], 
    ['Commute', 2], 
    ['Watch TV', 2], 
    ['Sleep', 7] 
]); 

에 -, 다른 패스 기본 옵션 기능 val를 전달합니다. 한 번 google.setOnLoadCallback(drawChart)에 한 번 성공 함수 :

은 또한 당신은 어쩌면 당신은 단지 두 번 drawChart를 호출하여 자신을 혼동이

$(xml).find('Pie').each(function() { 
    var sTitle = $(this).find('Title').text(); 
    var sValue = $(this).find('Value').text(); 

    if (!isNaN(+sValue)) { 
     sValue = +sValue; 
    } 

    values.push([sTitle, sValue]); 
}); 
+0

감사합니다. Alexander. 그것은 완벽하게 작동했습니다. 모두에게 도움을 주셔서 감사합니다 :) – user3689990

0

XML 파일, 그것을 잘 작동합니다

drawChart(values); 

희망. 값 배열이 비어 있지 않은 경우

+0

아니요 전에 시도한 적이 없습니다. 내가 그것을 할 때 차트에 데이터를 제대로 표시하지 않습니다. – user3689990

0

같은 번호로 문자열에서 sValue을 변환해야합니다. setOnLoadCallback을 제거하거나 (두 가지 모두에 대한로드 상태를 주시하는 함수를 생성하고 둘 다로드 될 때 drawChart을 호출하십시오). 그리고 Alexanders 제안을 구현하십시오.

관련 문제