#1
  1. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Nov 2009
    Posts
    16
    Rep Power
    0

    how to fill an image with a pattern


    hello,
    I want to make a website which I can change the pattern of an area with another one that the user choose.
    I have no problem with selecting a specific area of the image.
    For example.This is the first
    and I want to apply pattern to make the following picture


    How should I do that?

    Thanks
  2. #2
  3. Transforming Moderator
    Devshed Supreme Being (6500+ posts)

    Join Date
    Mar 2007
    Location
    Washington, USA
    Posts
    14,295
    Rep Power
    9400
    Easiest way? Multiple pictures. Especially if there's only a small number of combinations.

    Otherwise layering will work: put the normal image in the "back" (background image, zindex, whatever) and overlay an image of the same size containing just the difference, as in just the colored portion of that image, on top. Like a mask. Use transparency for the shared portion.
  4. #3
  5. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Nov 2009
    Posts
    16
    Rep Power
    0
    Originally Posted by requinix
    Easiest way? Multiple pictures. Especially if there's only a small number of combinations.

    Otherwise layering will work: put the normal image in the "back" (background image, zindex, whatever) and overlay an image of the same size containing just the difference, as in just the colored portion of that image, on top. Like a mask. Use transparency for the shared portion.
    Thanks for your reply,
    Actually there are a lot of models with different colors and pattern and also many more sofas.
    So I have to use the second way.But is it possible in the second way to show the corners and places where the pattern turn around?
  6. #4
  7. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Nov 2009
    Posts
    16
    Rep Power
    0
    I forgot to mention that there is a website doing that.The address is :fama.es
  8. #5
  9. Transforming Moderator
    Devshed Supreme Being (6500+ posts)

    Join Date
    Mar 2007
    Location
    Washington, USA
    Posts
    14,295
    Rep Power
    9400
    Originally Posted by hno2005
    But is it possible in the second way to show the corners and places where the pattern turn around?
    If you can create an image that looks like what you want then all you have to do is remove the part you changed (with the design) and put it into a different image. As far as the user is concerned the two together will look like your original, combined image.

    Originally Posted by hno2005
    I forgot to mention that there is a website doing that.The address is :fama.es
    They do something complicated that runs entirely on the server so I can't tell you exactly how it works. What I can say is that it seems they generate dynamically a single image containing all the changes.
  10. #6
  11. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Nov 2009
    Posts
    16
    Rep Power
    0
    Originally Posted by requinix
    If you can create an image that looks like what you want then all you have to do is remove the part you changed (with the design) and put it into a different image. As far as the user is concerned the two together will look like your original, combined image.


    They do something complicated that runs entirely on the server so I can't tell you exactly how it works. What I can say is that it seems they generate dynamically a single image containing all the changes.
    But i can't create an image for each part with different colors and patterns.
    What I need to do is to create something like a map of the image or something and apply different patterns to it.But I don't know how.
    Thanks
  12. #7
  13. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Nov 2009
    Posts
    16
    Rep Power
    0
    I found a solution but the first step is to create bump-map from the image which can be done by photoshop.Is there anyway to create bump-map from server side or client side without using photoshop or other software.I need to so that because I'm making a cms for that.
    Thanks
  14. #8
  15. Transforming Moderator
    Devshed Supreme Being (6500+ posts)

    Join Date
    Mar 2007
    Location
    Washington, USA
    Posts
    14,295
    Rep Power
    9400
    Originally Posted by hno2005
    But i can't create an image for each part with different colors and patterns.
    What I need to do is to create something like a map of the image or something and apply different patterns to it.But I don't know how.
    That's what you want to do because that's how you think of the process. Without realizing how complicated it is.

    What actual sources do you have to deal with? It sounded like you had images for all the different patterned furniture but are you saying you only have the basic white picture and then just... swatches? That alone will not be enough to get the end result you want - all you can do is pattern and highlight/shadow parts of it. Not, like, change the orientation of the pattern as in your example.

    Originally Posted by hno2005
    I found a solution but the first step is to create bump-map from the image which can be done by photoshop.Is there anyway to create bump-map from server side or client side without using photoshop or other software.
    No, unless you want to start learning about 3d graphics programming. Or want to hire someone who does.
    Overlaying images will be a lot easier than dealing with bump maps.

IMN logo majestic logo threadwatch logo seochat tools logo