Raphael.js - image with it's original width and height size?

Edward picture Edward · May 29, 2012 · Viewed 10.8k times · Source

Hi RaphaelJS users =) ,

I have maybe a dumb-ish question, but I can't seem to find the answer, the thing is, I'm trying to load/create an image with Raphael, that's fine, like this:

var image_1 = paper.image('/img/img1.jpg', 0, 0, 100, 100);

But as you can see, it always seems like you have to give the "width" and "height" properties, I already checked the documentation, but it's always short and not that's detailed, and I tried giving null parameters or empty parameters, but it doesn't work...

So I'm wondering if there is actually a direct way in raphael to do this, or....do I have to always get those values before???

I mean, something like this?:

var imgURL = "../img/img1.jpg"

var myImg = new Image();
myImg.src = imgURL;

var width = myImg.width;
var height = myImg.height;

   //create the image with the obtained width and height:
    var image_1 = paper.image('/img/img1.jpg', 0, 0, width, height);

And so that way I load with the original size of the image and that kinda solves my problem, but....isn't there way inside Raphael to do this???

Answer

Edward picture Edward · Jun 22, 2012

For now...I guess I'll have to answer my own question with my own answer, cause there seems to be no other way that I've found or that someone has told me =P

var imgURL = "../img/img1.jpg"

var myImg = new Image();
myImg.src = imgURL;

var width = myImg.width;
var height = myImg.height;

   //create the image with the obtained width and height:
    var image_1 = paper.image('/img/img1.jpg', 0, 0, width, height);