2017-12-10 3 views
0

내 결과 또는 값을 자바 스크립트의 함수에서 차트로 인쇄하려고 할 때 막힐 수 있습니다.함수 자바 스크립트에서 값을 가져 와서 차트에 인쇄하는 방법

<script type="text/javascript"> 
$(document).ready(function(){ 
      var testModel = id3(examples_personality,'kepribadian',features_personality); 
      document.getElementById("akurasi").innerText = calcError(samples_personality,testModel,'kepribadian'); 
}); 

</script> 

와 나는이 같은 결과 인쇄하려고 : 나는 HTML에 사용, 값이 나타날 경우

<span id='akurasi'></span> 

가 잘 작동이야,하지만 이것은 내가 자바 스크립트에서 내 함수를 호출하는 방법입니다 차트에 사용할 때 작동하지 않습니다. 나는이에서 차트 chartjs를 사용하여 내용

// Data Training Chart 
new Chart(document.getElementById("Data-Training-chart"), { 
    type: 'polarArea', 
    data: { 
     labels: ["Data Training (%)", "Data Testing (%)"], 
     datasets: [ 
     { 
      label: "jumlah ", 
      backgroundColor: ["#3e95cd", "#ff4137"], 
      data: [<span id='akurasi'></span>,100] 
     } 
     ] 
    }, 
    options: { 
     legend: { display: false }, 
     title: { 
     display: true, 
     text: 'Data Training' 
     } 
    } 
}); 

: Link chart

답변

0

doc-side으로는 데이터 포인트 (숫자)의 배열을 사용할 필요가 주장하지만 data을 내이 내 코드 차트

,691,363 : 당신은 예를 들어 getElementById를 사용하여이 값을 조회 할 수 있습니다

data: [<span id='akurasi'></span>,100] 

: 첫 번째 항목은 숫자가 아닌 당신의 calcError 기능 akurasi으로 보여 숫자 값을 반환하는 경우210

data: [+document.getElementById("akurasi").innerText,100] 

그것은 작동합니다 :

<span id='akurasi'>35</span> 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
 

 
<html xmlns="http://www.w3.org/1999/xhtml"> 
 

 
<head> 
 
    <title>Hello!</title> 
 
</head> 
 

 
<body> 
 

 
<canvas id="chart" width="100" height="100"></canvas> 
 
<span id='akurasi'></span> 
 

 
</body> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.1/Chart.bundle.js"></script> 
 

 
<script type="text/javascript"> 
 

 
$(document).ready(function(){ 
 
      // ... 
 
      document.getElementById("akurasi").innerText = 35; 
 
      
 
      var chart = setupChart(); 
 
      // you can do whatever you want with this chart here... 
 
      
 
}); 
 

 
function setupChart(){ 
 

 
    return new Chart(document.getElementById("chart"), { 
 
     type: 'polarArea', 
 
     data: { 
 
      labels: ["Data Training (%)", "Data Testing (%)"], 
 
      datasets: [ 
 
      { 
 
       label: "jumlah ", 
 
       backgroundColor: ["#3e95cd", "#ff4137"], 
 
       data: [+document.getElementById("akurasi").innerText,100] 
 
      } 
 
      ] 
 
     }, 
 
     options: { 
 
      legend: { display: false }, 
 
      title: { 
 
      display: true, 
 
      text: 'Data Training' 
 
      } 
 
     } 
 
    }); 
 

 
} 
 

 
</script> 
 
</html>

희망이 도움이됩니다.

+0

나는 그것을 실행하지만 요소를 검사 할 때 코드는 여전히 "+ document.getElementById ("akurasi "). innerText"함수의 값이 아닌 calcError로 인쇄됩니다. 값은 절대적으로 숫자 값입니다. html 코드와 그 결과를 출력하려고하기 때문입니다. –

+0

$ (document) .ready가 해고 된 후 차트를 설정합니까? 방금 getElementById가 작동해야 함을 보여주는 예제를 제공했습니다. – Blauharley

+0

당신이 35에 값을 가지고 있기 때문에 작동하지만, 이것과 같이하면 (이 값은 get document.getElementById ("akurasi"). innerText = calcError (samples_personality, testModel, 'kepribadian');)하지만 작동하지 않습니다. –