GWT canvas: how to change line color

Question

Since the canvas drawing in GWT was all over the map, let me be explicit and say that I use this:

import com.google.gwt.canvas.client.Canvas; 

The problem is that if I draw a black line and then change it to red, the first line will also be changed to red.

 // draw line in black context.moveTo(xScale(-0.5), yScale(0.0)); context.lineTo(xScale(15.0), yScale(0.0)); context.stroke(); // change to red context.setStrokeStyle(CssColor.make(255,0,0)); context.moveTo(xScale(0.0), yScale(20.0)); context.lineTo(xScale(0.0), yScale(-20.0)); context.stroke(); // both lines appear in red 

What is the correct method for changing the color of a pen?

Answer 1

Call context.beginPath() before each new shape / line with a different color fixes your problem.

 // draw line in black context.beginPath(); context.moveTo(xScale(-0.5), yScale(0.0)); context.lineTo(xScale(15.0), yScale(0.0)); context.stroke(); context.beginPath(); // change to red context.setStrokeStyle(CssColor.make(255,0,0)); context.moveTo(xScale(0.0), yScale(20.0)); context.lineTo(xScale(0.0), yScale(-20.0)); context.stroke(); // both lines appear in red 

Basically beginPath () pressed state