HTML5畫布繪製

Question

我有一個100（寬）×排成一列和5×6

柱100（高度）畫布其對他們繪製的三角形目前畫布被佈置在這樣的方式每一幅畫布都互相重疊。我想補充一下就成的三角形區域

是有辦法繞過點擊下面的畫布時，點擊是在幫帆布

Answer 1

使用EaselJS，您可以使用nextStage屬性將CreateJS鼠標交互傳遞到DOM中彼此相交的畫布。

// Overlapping Canvases 
<canvas id="canvas1"></canvas> 
<canvas id="canvas2"></canvas> 

// Multiple Stages 
stage1 = new createjs.Stage("canvas1"), 
    stage2 = new createjs.Stage("canvas2"); 

// Mouse events on content in each stage 
stage1child.on("click", handleClick); 
stage2child.on("click", handleClick); 

// Stage 2 is higher in the DOM, so it will receive the mouse events first. 
// Pass them on to the lower canvas/stage 
stage2.nextStage = stage1; 

下面是詳細信息：

• nextStage documentation
• TwoStages demo in GitHub
• TwoStages demo on createjs.com

Answer 2

我沒有完全理解你的問題的透明區域，但如果你只是想爲點擊註冊到畫布波紋管的形狀，那麼你需要禁用頂部形狀的鼠標交互，就像這樣：

triangleShape.mouseEnabled = false;

通過這樣做，任何鼠標事件會忽略了這個形狀，而是傳遞給下面的物體。