Question

我在JS中使用了一些代码，我使用的是php脚本。（基于chartjs）

$licznik=0;
    foreach ($all as $key => $row) {
                                      $imiona[$licznik]=$row['imie'];
                                      $nazwiska[$licznik]=$row['nazwisko'];
                                      $tak[$licznik]=$row['tak'];
                                      $nie[$licznik]=$row['nie'];
                                      $licznik++;
                                    }


    $wynik.='<div>
      <canvas id="'.$team.'">
      </canvas>
      </div>
      <br><hr>';

   $wynik.='<script>

  var barChartData = {
    labels : ["'.wypiszimiona($imiona,$nazwiska,$licznik).'], //radni
    datasets : [
      { //głosy na nie
        fillColor : "#BA0606",
      strokeColor : "#FF0808",
        highlightFill: "rgba(220,220,220,0.75)",
        highlightStroke: "rgba(220,220,220,1)",
        data : ['.wypisznie($nie,$licznik).']
      },
      { //głosy na tak
        fillColor : "#23BA06",
        strokeColor : "#30F70A",
        highlightFill : "rgba(151,187,205,0.75)",
        highlightStroke : "rgba(151,187,205,1)",
        data : ['.wypisztak($tak,$licznik).']
      }
    ]
  };
  window.onload = function(){
    var ctx = document.getElementById("'.$team.'").getContext("2d");
    window.myBar = new Chart(ctx).StackedBar(barChartData, {
      responsive : true
    });

      };
  </script>';

它只渲染最后一个画布，另一个不渲染（但JS代码是正确的（在源代码中）。我不知道什么是错的。我在JS中不擅长:(

Answer 1

基于您提供的少量信息，我假设您正在使用不同的php变量复制和粘贴该js代码。每次执行此操作时，您都会添加告诉客户端的代码

window.onload = function(){
    var ctx = document.getElementById("'.$team.'").getContext("2d");
    window.myBar = new Chart(ctx).StackedBar(barChartData, {
      responsive : true
    });

如果你不止一次这样做，你就会覆盖window.onload，只会发生最后一次重写，这意味着只会绘制最后一个画布。

Answer 2

你需要用双引号关闭（并在其中一些中打开）JS字符串。有几行缺少它们：

...labels : ["'.wypiszimiona($imiona,$nazwiska,$licznik).'"]...
...data : ["'.wypisznie($nie,$licznik).'"]...
...data : ["'.wypisztak($tak,$licznik).'"]...

我可能错过了一些。

多次使用Javascript函数

2 个答案: