Morsmetus
Morsmetus

Reputation: 63

Modify canvas objects

I am sort of new to Canvas, I have an object(?) created, I was searching how to modify this ball sort of like it is in css, I can't select it with selector to add options with javascript/jquery and I was unable to find any list or tutorial where I could get all the options how far I can change visuals of the ball.

if there is anyone who understands canvas and is not newbie like me in this, please could you share your knowledge to me about this?

var BALL = function(x,y){
    this.x = x;
    this.y = y;

    this.color  = "red";
    this.radius = 7;
    this.saveRadius = 7;
    this.vx     = 3;
    this.saveVx = 3;
    this.vy     = -4;
    this.saveVy = -4;
}

Upvotes: 2

Views: 3964

Answers (1)

Pierpaolo Cira
Pierpaolo Cira

Reputation: 1477

Your problem is due to the canvas nature.

There are several big differences between raster and vectorial images.

Canvas is like a blackboard where you write anything you need... and you can't modify more than what you've designed over. It is like any raster image (think of a JPG image to understand). So, using JS/jQuery, you can only access canvas elements and write inside new content.

If you need to draw content and to manipulate it by JS, you need to use vectorial images object. In this case, you should try to use SVG instead of canvas.

This can be a useful starting point: Canvas vs SVG: Choosing the Right Tool for the Job.

Upvotes: 4

Related Questions