Info

Canvas draw lines

Preparation code

<canvas id="canvasGuide" width="1024" height="768">
</canvas>
<script
<script>
  Benchmark.prototype.setup = function() {
    var canvas = document.getElementById("canvasGuide"),
        context = canvas.getContext("2d");
  };
</script>

Preparation code output

Test runner

Warning! For accurate results, please disable Firebug before running the tests. (Why?)

Java applet disabled.

for (var x = 0; x < 1024; x += 10) {
  context.moveTo(x, 0);
  context.lineTo(x, 768);
}
context.strokeStyle = "#eee";
context.stroke();

for (var y = 0.5; y < 768; y += 10) {
  context.moveTo(0, y);
  context.lineTo(102400, y);
}
context.strokeStyle = "#eee";
context.stroke();

You can edit these tests or add even more tests to this page by appending /edit to the URL.

Compare results of other browsers

0 comments