Question

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 1

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);