Création d'objets canvas à un DPI supérieur à l'écran?

Question

J'ai un objet canvas que je dois pouvoir créer avec une résolution supérieure à celle de la résolution d'écran native. J'utilise la bibliothèque de graphes Flot, et j'ai besoin de produire un graphique qui soit aussi bon lorsqu'il est imprimé que lorsqu'il est affiché à l'écran. La seule méthode que je peux penser est de faire la taille de toile 3x plus grande, puis mise à l'échelle, mais je ne pense pas que cela fonctionnerait correctement quand je vais imprimer.

Des idées?

Answer 1

Vous suggérez que vous créez un élément de toile avec une largeur particulière et la hauteur (sa résolution native) et l'échelle à coordonnées différentes fenêtre, par exemple:

<canvas width="320" height="240" style="width: 640px; height: 480px"></canvas> 

Je pense un problème avec faire cela Soit le rendu d'impression peut traiter la toile mise à l'échelle comme une image et la restituer à la résolution du pixel du document, afin de ne pas obtenir l'amélioration souhaitée.

Pour ce que vous voulez il pourrait être utile de savoir si vous pouvez utiliser SVG.

Answer 2

Fermeture de la boucle sur celui-ci - J'ai trouvé la meilleure option est de créer un objet de toile à une résolution 2x, puis l'échelle en utilisant les paramètres CSS largeur et hauteur.