Is It Possible To Map Letters To A Cylinder Or A Sphere In Css3 Or Javascript?

I saw a picture mapped to a cylinder in CSS3 and I was wondering if this is possible with a text. Even better would be to map the text to a sphere. If it is not possible with pure

Solution 1:

As mentioned in the comments CSS3 only supports rotating and skewing elements, and doesn't have any support for spheres.

Although you can fake a sphere in SVG using something like Raphael.js, i don't think there's any real support for doing 3D stuff using Vector graphics. You'd have to map/wrap/skew the text yourself using some crazy math, and it still might not even be possible.

I think your only real hope is to use something like three.js to create an actual cube object. Then you could write your text to a hidden canvas element to get an image of the text, and map the image onto the cube as a material, as in this example.