Y a-t-il un moyen de dessiner une ligne à l'aide de JavaScript et de la toile avec une antialiasing "meilleure", comme le flash fait? P>
Je connais le truc de Math.Floor (Coord) +0.5 pour obtenir une ligne exactement de 1 pixels lorsque vous en avez besoin, mais ce n'est pas ce que je veux dire. Les lignes bleues suivantes dessinées à l'aide de toile look _ugy dans tous les navigateurs em> prenant en charge HTML5 et Cavas, ils utilisent donc probablement le même algorithme d'antialiasing em> (probablement codé pour la vitesse, pas pour le meilleure impression visuelle). C'est la même chose, peu importe la largeur de la ligne (en fait le plus épais, le Lablier): p>
Capture d'écran bleu bleu de 1px: P>
p>
et 3px: p>
p>
Comme vous pouvez le constater, ce n'est pas la plus belle façon de dessiner de bonnes lignes antialiasées em>, et seule la ligne inférieure a l'air bien. Le client exige que l'application de manipulation graphique que je travaille sur doit em> "afavé" et est très exigeante de l'esthétique POV et
3 Réponses :
Je doute que vous allez trouver tout ce qui va le faire paraître vraiment bien qui n'est pas trop lent pour être utile. Une chose que vous pouvez essayer qui ne fera pas trop de mal aux performances consiste à attirer 4 lignes superposées les unes sur les autres, chacune décalée par une fraction d'un pixel dans X et Y. L'inconvénient est-il un peu flou. P>
Au lieu d'utiliser l'API de dessin 2D, vous pouvez utiliser les éléments vectoriels SVG. Vous devriez mettre en œuvre votre propre API pour le faire, mais de cette façon, vous obtiendrez de belles lignes, comme celles en flash. Le SVG-Edit est un exemple de ce que vous pouvez faire avec SVN dans le navigateur. P>
Leeching off de la réponse de Marius: p > SVG peut être tiré du côté du client avec JavaScript, car il s'agit d'éléments Dom. Et, aller de l'avant, il est accéléré du matériel. P> p>
Vous savez que les gens entendent crier lorsque vous utilisez toutes les casquettes, non? Utilisez des quantités judicieuses de gras b> et italiques i> le cas échéant, mais toutes les capsules sont juste une éteinte. Moche, tu pourrais dire.
Fwiw, de votre dessin, je me demande si vous voulez vraiment utiliser de la toile du tout. Il semble que les vecteurs puissent être plus appropriés. RAPHELJS semble fournir des lignes jolies via SVG et VML sur Firefox 3.0+, Safari 3.0+, Chrome 5.0+, Opera 9.5+ et Internet Explorer 6.0+. C'est un bon ensemble de moteurs de rendu soutenus là-bas. Vous pouvez ensuite utiliser une toile (superposée dans l'ordre Z) où / quand / si vous avez vraiment besoin d'un bitmap.
Merci! Je regarde à Raphaeljs en ce moment pour voir si cela correspond à mon application et c'est acceptable de performances ...
@ T.J. Crowder: Trouvez la façon d'ajouter Bac audacieux B> ou Italique B> à un titre Stackoverflow - alors vous pouvez critiquer
@Ian Boyd: La version de la question que j'ai commentée utilisait la totalité des bouchons dans le texte. Quant aux titres: Peut-être qu'il y a une raison i> l'emphase n'est pas autorisée? Et utiliser toutes les casquettes n'est pas la réponse?