nbremer/occupationscanvas

Adjust for pixel density

Opened this issue · 0 comments

Hi

Have you thought of adjusting your tutorial for device density? it will reduce the blur on the circle pack:

var width = Math.max($("#chart").width(),350) * window.devicePixelRatio - 20,
        height = (window.innerWidth < 768 ? width * window.devicePixelRatio: (window.innerHeight * window.devicePixelRatio)- 20);

 var canvas  = d3.select("#chart").append("canvas")
        .attr("id", "canvas")
        .attr("width", width)
        .attr("height", height)
        .style('width', (width / window.devicePixelRatio) + 'px')
        .style('height',(height / window.devicePixelRatio) + 'px');

The zooming isn't working with the adjustment but it's crisp now.