Java Image manipulation curve-bend image

Question

I have two images the first image of a cup ->

the second image is the label I want to wrap around the cup (this image is just an example, the actual app works with dynamic images).

I'm planning to clip the label image several time and place it on the cup, therefor creating a 36 jpegs from different angles, I'll use a 360 viewer to display the result on my website.

so far I've managed to take a trapezoid area of the lable image to create this (code is here)

The last step is to create this (used GIMP for this - using distort -> curve-bending)

Thank you

If you are willing to use bash shell script with Imagemagick, see http://www.fmwconcepts.com/imagemagick/cylinderize/index.php. But it will be similar timing to running Imagemagick. — fmw42, Mar 25 '18 at 17:31
These might be of interest: https://stackoverflow.com/questions/40997344/wrap-an-image-around-a-cylindrical-object-in-html5-javascript and https://stackoverflow.com/questions/6636730/wrap-an-image-or-video-around-a-cylinder-webkit-css-3d-transform — fmw42, Mar 25 '18 at 22:48
Already solved. My Java solution is super fast for me. 3.45 sec to generate 36 images — Kulpemovitz, Mar 26 '18 at 08:57

score 0 · Answer 1 · answered Mar 13 '18 at 12:53

0

What comes in my mind, is a technique called uv-mapping. See https://en.wikipedia.org/wiki/UV_mapping as a starting point.

See also J3D - How to use a UV mapping of an object to convert 2D coordinates to 3D ones

answered Mar 13 '18 at 12:53

Walter Kuhn

479
1
6
19

1

you are suggesting texture mapping, I don't want to do any rendering or use textures. thank you any way – Kulpemovitz Mar 13 '18 at 13:11

score 0 · Accepted Answer · answered Mar 25 '18 at 12:24

I've managed to do some work. At first, I use ImageMagick , it took 50 sec to generate 36 images... way to long for me. So I turned to Java, I've managed to do the simple transformation using a simple pixel by pixel and apply a Sin function

for(int y = 0; y < bounds.height ; y++)
                {
                    for (int x = 0; x < bounds.width ; x++) {
                        int pixelRGB = img.getRGB(x, y);
                        int newX = x;
                        int newY = ((int)(Math.sin(x*Math.PI/bounds.width) * 40 )) + y  ;
                        newImg.setRGB(newX, newY, pixelRGB);            
                    }
                }

main line is -> (Math.sin(x * Math.PI / bounds.width) * 40) + y

Math.PI / bounds.width -> make sure I get only the positive values for Y from the Sin function.
bounds.width - is the original image width, for the Sin function it tells to start from 0,0 go to positive Y values and intersec with th X axis back at bounds.width.
40 -> is the level of curvature you'll want to use
y - just a Y axis offset. if not applied you'll get a single line in the target image

Java Image manipulation curve-bend image

2 Answers2

main line is -> (Math.sin(x * Math.PI / bounds.width) * 40) + y