Skip to main content
M
miguel.faber
Participant
February 11, 2020
Question

Make text selectable HTML5

  • February 11, 2020
  • 1 reply
  • 831 views

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 😞

This topic has been closed for replies.

1 reply

C
ClayUUID
Legend
February 11, 2020

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.

    M
    miguel.faberAuthor
    Participant
    February 11, 2020

    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?!

    P
    paulmignard
    Participant
    February 26, 2020

    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.

     

      Terms & ConditionsAccessibility statement
      Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices