axelcdv
axelcdv

Reputation: 753

Stack two images and merge them into a single one in javascript

I've made some research on this but haven't found any solution, so I'm not sure it is even possible, but here is my problem:

I'm developing a website using only HTML/CSS + Javascript, using a REST API, and I need to merge two images in one to use it as an icon for the google maps API. I can't do it on the server because it depends on the client, and I need to provide an image at the end. I've seen some things, like pixastic, but it isn't supported in IE and unfortunately some people still use that :p...

Do you know other ways to do that?

Thanks in advance!

EDIT: actually, you just have to use Google's overlay tools in the API. I just put one Marker on top of the other and adjusted the size and position using the MarkerImage class.

Upvotes: 0

Views: 3125

Answers (1)

Jason Kaczmarsky
Jason Kaczmarsky

Reputation: 1686

You could just put one over the other and change the opacity of the top one: http://jsfiddle.net/cAWJs/

Using blend modes like your example site you would need canvas support though.

Upvotes: 1

Related Questions