0

私のテスト ページ[リンクが削除されました]では、正方形の右上隅から放射状に伸びる一連の線があるはずです (左側の垂直の長方形は、無関係なものに使用されるサイドバーです)。極座標図の原点として右上を使用すると、線はtheta=piから に移動し3pi/2ます。

ただし、キャンバスが拡大されているように見えます。私 (および私の友人) が見ることができるのは、左上に拡大されたように、いくつかの大きなぼやけた線だけです。スケーリングは行われておらず、Canvas オブジェクト用の jQuery プラグインである jCanvas を使用しています。そして、座標を出力すると、紙にプロットすると、座標が本来あるべきものと一致します。

問題は何でしょうか？

これは私のコードです：

<script>

var gradations_theta, theta, this_x1, this_y1, this_x2, this_y2, start_r, end_r;
gradations_theta = 24;
start_r = 20;   // 20 pixels from center of galaxy
end_r  = 800;   // 800 pixels from center of galaxy (to corners west and south of center)

$(function() {
    for (theta = Math.PI; theta <= (Math.PI * 3 / 2); theta += (Math.PI / (gradations_theta * 2))) {

        this_x1 = Math.floor(800 + (start_r * Math.cos(theta)));
        this_y1 = Math.floor(Math.abs(start_r * Math.sin(theta)));
        this_x2 = Math.floor(800 + (end_r * Math.cos(theta)));
        this_y2 = Math.floor(Math.abs(end_r * Math.sin(theta)));

        $('#space-map')
        .restoreCanvas()
        .drawLine({
            strokeStyle: '#fff',
            strokeWidth: 1,
            x1: this_x1,
            y1: this_y1,
            x2: this_x2,
            y2: this_y2
        });

    }
});

</script>
4

1 に答える 1

0

canvasどうやら組み込み属性を使用して幅と高さを設定し、この問題を解決しましたwidth。heightこの詳細に関する私の質問はここで回答されています: CSS を使用するとキャンバスが引き伸ばされますが、「幅」/「高さ」プロパティでは通常のキャンバスになります。

于 2012-04-26T19:42:00.997 に答える