0

私はいくつかのキャンバスのものを試しています、

これが私のコードです。JavaScriptでsqlvariablesを使用できるようにする方法について誰かが光を当てることができますか?

<script type="text/javascript">
 window.onload = function(){
 var canvas = document.getElementById("myCanvas");
 var context = canvas.getContext("2d");
 var imageObj = new Image();
 imageObj.onload = function(){
     context.drawImage(imageObj, 0, 0);
     context.font = "40pt Calibri";

     context.fillText("Aanvaller1", 75, 260);
     context.fillText("Aanvaller2", 450, 260);

     context.fillText("Mid1", 200, 560);         
     context.fillText("Mid2", 450, 560);

      context.fillText("Verdediger1", 70, 860);
      context.fillText("Verdediger2", 425, 860);

      context.fillText("Keeper", 310, 1010);
    };
 imageObj.src = "voetbalveld2.png"; 
};
</script>


<canvas id="myCanvas" width="804" height="1200"></canvas>

したがって、これは必要に応じてテキストを描画しますが、データベースにクエリを実行し、テキストをハードコーディングした場所にデータベースから名前を付けたいと考えています。事前にt​​hnx。

db などを照会するコードは必要ありません。js や canvas と組み合わせて使用​​する方法を知る必要があるだけです。

4

1 に答える 1

2

Javascriptはクライアントブラウザで実行され、SQLデータベースはサーバーに保存されます。必要なのは、クライアント側のコードを使用して、サーバーにクエリを実行してデータを取得する機能です。私が考えているのは、（ここではPHPが私の選択です）とAjaxの間の中間言語です。

したがって、JavascriptはAjaxリクエストを使用してPHPページを呼び出すことができます。PHPは、すべての変数を含むXML / JSONを構造化された形式で返します。これにより、Jsは解析してキャンバスコードにプラグインできます。

getNames.php
--------------
// mysql stuff goes here
$arr = array('name1' => 'Aanvaller1', 'name2' => 'Aanvaller2', 'name3' => 'Mid1');
echo json_encode($arr);

javascriptコード：

<script type="text/javascript">
  $(document).ready(function(){
    var json = null;
    $.ajax({
        'async': false,
        'global': false,
        'url': 'getNames.php',
        'dataType': "json",
        'success': function (data) {
            json = data;
        }
    });
  });

これで、mysqlデータを含む「json」という変数ができました。それを解析して、キャンバスに貼り付けます。

于 2013-03-06T09:37:47.917 に答える