[WebProfilerBundle] Draw retina canvas if devicePixelRatio is bigger than 1

This commit is contained in:
Henrik Bjørnskov 2013-02-14 11:49:47 +01:00
parent 223cc6f7c7
commit 439b8bcdf3
1 changed files with 18 additions and 3 deletions

View File

@ -194,7 +194,10 @@
h = space,
x = request.left * ratio + space, // position
canvas = cache.get(elementId) || cache.set(elementId, document.getElementById(elementId)),
ctx = canvas.getContext("2d");
ctx = canvas.getContext("2d"),
backingStoreRatio,
scaleRatio,
devicePixelRatio;
// Filter events whose total time is below the threshold.
drawableEvents = request.events.filter(function(event) {
@ -203,8 +206,20 @@
canvasHeight += gapPerEvent * drawableEvents.length;
canvas.width = width;
canvas.height = canvasHeight;
// For retina displays so text and boxes will be crisp
devicePixelRatio = window.devicePixelRatio == "undefined" ? 1 : window.devicePixelRatio;
backingStoreRatio = ctx.webkitBackingStorePixelRatio == "undefined" ? 1 : ctx.webkitBackingStorePixelRatio;
scaleRatio = devicePixelRatio / 1;
canvasHeight += gapPerEvent * drawableEvents.length;
canvas.width = width * scaleRatio;
canvas.height = canvasHeight * scaleRatio;
canvas.style.width = width + 'px';
canvas.style.height = canvasHeight + 'px';
ctx.scale(scaleRatio, scaleRatio);
ctx.textBaseline = "middle";
ctx.lineWidth = 0;