Sorry if my terminology is confusing. My Cavases are stacked--as in their z-indexes place one on the other ( http://www.w3.org/TR/CSS21/visuren.html#propdef-z-index)--and are visible at the same time as the Canvas is a transparent object.
As I said before, if you don't want the lower layer to show through, you need to fill the upper layer with an opaque (alpha 1.0) color. Alternately I guess you could set style="display: none" for the Canvas you don't want showing at that moment (though I've not tried this; in my app, I want *all* Canvas layers to show). On Thursday, April 11, 2013 11:11:47 AM UTC-4, membersound wrote: > > Could you post the code where you stack the layers? > Because as I wrote in, my 2 canvsa layers appear one below the other, not > behind each other! > So both layers are visible at a time. What's wrong with the code example I > posted? > > > 2013/4/10 Thad <[email protected] <javascript:>> > >> If you don't want the lower layer to show through, you need to fill the >> upper layer with an opaque (alpha 1.0) color. >> >> The transparency of canvas is a good think at least for one of my apps. I >> have three Canvas, all stacked in an AbsolutePanel. The lowest Canvas holds >> an image (a PNG that was converted on the server from a scanned TIFF). The >> next layer holds objects the user has drawn on the Canvas. The top-most >> layer is the interactive drawing layer, where I track mouse down, move, and >> up. (There's also a fourth Canvas that is not on screen. I use this for >> testing if clicks on the AbsolutePanel are clicks on a current object.) >> >> >> On Wednesday, April 10, 2013 6:01:58 AM UTC-4, membersound wrote: >>> >>> How do you stack multiple canvas onto each other? >>> I tried the following, which only placed them below each other so that >>> both are visible at a time. >>> >>> .layer1 { >>> z-index: 1; >>> left: 0; >>> top: 0; >>> } >>> .layer2 { >>> z-index: 0; >>> left: 0; >>> top: 0; >>> } >>> >>> <gwt:AbsolutePanel> >>> <c:Canvas styleName="{style.layer1}" /> >>> <c:Canvas styleName="{style.layer2}" /> >>> </gwt:AbsolutePanel> >>> >> -- >> You received this message because you are subscribed to a topic in the >> Google Groups "Google Web Toolkit" group. >> To unsubscribe from this topic, visit >> https://groups.google.com/d/topic/google-web-toolkit/MXGRDjc6toQ/unsubscribe?hl=en >> . >> To unsubscribe from this group and all its topics, send an email to >> [email protected] <javascript:>. >> To post to this group, send email to >> [email protected]<javascript:> >> . >> Visit this group at >> http://groups.google.com/group/google-web-toolkit?hl=en. >> For more options, visit https://groups.google.com/groups/opt_out. >> >> >> > > -- You received this message because you are subscribed to the Google Groups "Google Web Toolkit" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected]. To post to this group, send email to [email protected]. Visit this group at http://groups.google.com/group/google-web-toolkit?hl=en. For more options, visit https://groups.google.com/groups/opt_out.
