Copy link to clipboard
Copied
Is that right, that there's no way to accomplish a simple task like making text selectable to copy it within a HTML5 canvas?? I mean it can't be more basic in my opinion ... any ideas how to deal with that?
I created a quite complex interactive graphic and now the client wants the text to be selectable ... I can't tell him that's not possible, sorry ... Thanks in advance for any help 😞
Copy link to clipboard
Copied
Canvas text can't be selectable because the canvas is a bitmap element. All text rendered into it is just pixels. You may as well ask to make text in a JPG selectable.
Copy link to clipboard
Copied
And is there a workaround? I mean ... I would expect that it's not a very uncommon question for a client to make text within an info graphic selectable. Is it?!
Copy link to clipboard
Copied
This is literally not going to happen inside of Animate. When you create a text field you are just drawing text into the canvas. I checked the source for EaselJS and they are using fillText (link to source - MDN article on fillText) which like @ClayUUID said is just text rendered into pixels. In effect, there's no text to select, the dom just sees it as a image. To do what you're asking you'd need to create a DOM element to have the text selectable. You'd have to code that though, there's no support in Animate for it.