0

jCanvasを使用してキャンバスに図形を描画しています。drawArc関数を使用してレイヤーにカーソルを合わせるとアラートメッセージが表示され、drawRectメソッドを使用してレイヤーにカーソルを合わせると別のアラートメッセージが表示されます。jCanvasを使用して実行できますか。また、長方形にカーソルを合わせると何も起こりません。

PS：KineticJSはそれを行うことができます！

これがコードです... 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript" src="../../javascript/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="../../javascript/jcanvas.min.js"></script>
<script type="text/javascript">
$(document).ready(function(e) {
    var canvas = $('#can');
    canvas.attr({
        width:$(window).innerWidth(),
        height:$(window).innerHeight()
    });
    var width = canvas.innerWidth();
    var height = canvas.innerHeight()
    var context = canvas.get(0).getContext('2d');

    $("canvas").addLayer({
        method: "drawRect",
        fillStyle: "#36b",
        x: 100, y: 100,
        width: 80, height: 40
    });

    $("canvas").addLayer({
        method: "drawArc",
        fillStyle: "#36b",
        x: 20, y: 100,
        radius: 20
    });

    $("canvas").drawLayers();

    $(window).mousemove(function(e) {
        var x = e.pageX;
        var y = e.pageY;
        if(context.isPointInPath(x,y))
            alert("Found it!");
    });

});
</script>
</head>

<body>
<canvas id="can"></canvas>
</body>
</html>
4

1 に答える 1

2

問題ない。Caleb Evans によるこのベータ ビルドが役立つかもしれません。以下のイベントが含まれています...

  • クリック
  • dblclick
  • マウスダウン
  • マウスアップ
  • マウス移動

jsFiddleのデモへのリンク。

于 2012-02-29T17:13:07.850 に答える