RHCode Posted May 28, 2017 Share Posted May 28, 2017 In javascript, there is a translate(x,y); function. If I wanted to have a rect translated, but another rect below it not, how could I do that. In processing, they have a resetMatrix(); function. For example: ctx.translate(100,100); // Translate function ctx.fillRect(0,0,100,100); // Apply translate effects onto this (translate the rect to 100,100) //Don't want to translate this ctx.fillRect(100,100,50,50); // want it to stay at (100,100), not be translated to (200,200) Link to comment Share on other sites More sharing options...
Ingolme Posted May 28, 2017 Share Posted May 28, 2017 The save() and restore() methods are useful for that. save() remembers the current state, restore brings back the state of the last save() call. ctx.save(); // Remember the current state ctx.translate(100,100); ctx.fillRect(0,0,100,100); ctx.restore(); // Return to the previous state ctx.fillRect(100,100,50,50); 1 Link to comment Share on other sites More sharing options...
RHCode Posted May 29, 2017 Author Share Posted May 29, 2017 20 hours ago, Ingolme said: The save() and restore() methods are useful for that. save() remembers the current state, restore brings back the state of the last save() call. ctx.save(); // Remember the current state ctx.translate(100,100); ctx.fillRect(0,0,100,100); ctx.restore(); // Return to the previous state ctx.fillRect(100,100,50,50); Thanks so much! Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now