ajax can load the images dynamically but my problem is how to generate the image ?
The variables are too many 1000 ( diff types of fabric ) x 3 ( types of shirts ) x 5 ( types of cuffs ). So I am sure the images need to be generated using some kind of script of software and then ajax can be used to load it.
Scene 7 will do exactly this. It's an Adobe product with all sorts of imaging features. Amazon uses it and I used it for our eCommerce department. You start with a base image and create swatches for all the different fabric types. As you select each fabric, and image is generated on the IPS and returned to you. The images are also cached on the server so it doesn't have to constantly regenerate everything.
Not sure what it costs, that was someone else's job. But Adobe's tech support was great and even fixed a light-box bug for us that was causing incompatibilities.
I've been working on an open-source system similar to this, but it's no where near ready for production.
This is a quite complex app. one where they have worked out all the combinations and accounted for them. I had a quick look and look at this. That's the image for the base. it's a php script that outputs custom images based off URL params. notice how there is no collar though. the collar image is another image overlayed (using absolute positioning) overtop. the plackett is another, as are the buttons. all the options are there but the amount of possible images are drastically decreased. the base image does not have to be changed for all the available options.
Also the images are very clearly CGI. You're best bet: go to the drawing board figure out what can be abstracted and layed out and then start planning for smart imaging. You can totally do this with many png files though and a quick ajax app. the hard part of this is NOT the code. it's the images for SURE.