Kinetic js canvas lines and shapes blurred at centre, but gets crisp when nearing the edges

Question

Here is the plunkr

http://plnkr.co/edit/05OtTgW78wibGz57Lrao

When the viewport width variable is set to 1366. In the plunkr when u move the cursor near the centre u will see the lines are almost gray and is blurred. But when moved near the edges it is crisp and black.

But in the same case when the viewport width is set to 1000 currently it is commented in plunkr. The lines are crisp at all the places, edges , centre.

This scenario applies to all drawing and not only the lines any thing i draw in the centre is bit dull while on the edges it is sharp at certain width of the stage.

Another issue here is eventhough i have specified the vertical lines as dashed it comes as as continuous lines, again this also depends on the viewport height mentioned.

Anyone has any insights on this???

Answer 1

Its just because I used the floating point coordinate in stage width...

Got the answer from the kinetic js community.. thanks