0

基本的に 2 次元配列を視覚化するためのフロントエンドを作成したいと考えています。これは大きなグリッドであり、遠くから見るとタイルが 1 ピクセルにまで煮詰められるほどの大きさです。

表現をナビゲートするためにズームと2Dスクロールを実装したいと思います（これは色付きの正方形にすぎません）。

これについて最も簡単な方法は何ですか？これは私が最も興味を持っているプロジェクトの一部ではないので、巨大なフレームワークを学ぶ必要は避けたいと思います.

私は、要素に対してcanvasand/orJS/CSSテクニックを完全に使用したいと思っています。

4

2 に答える 2

0

2次元配列には何らかのパターンがありますか? 画像か何かになりますか？automata rule110 のようなものや単純な/半分高度なグラフィック キャンバスを表現することは、KineticJS のような素晴らしいオプションまたはフレームワークです。

于 2013-02-06T20:43:07.187 に答える
-1

このコードはキャンバス用です

<canvas id="canvas"></canvas>
<script>
var arr = new Array(new Array(1,2,3), new Array(1,2,1), new Array(2,3,1));
var ctx = document.getElementById("canvas").getContext("2d");
var size = 10;
for(var i=0; i< 3;i++){
    for(var j=0; j< 3;j++){
        if(arr[i][j]==1){
        ctx.fillStyle = "red";
        }else if(arr[i][j]==2) {
        ctx.fillStyle = "blue";
        }else if(arr[i][j]==3){
        ctx.fillStyle = "green";
        }

        ctx.fillRect(i*(size+1),j*(size+1),size,size);
    }
}
</script>
于 2013-02-06T21:05:56.363 に答える