Rendu 2D et zoom avant avec SVG

Question

Ma tâche consiste à développer un algorithme qui adapte différents types de courbes à une séquence ponctuelle donnée dans un espace à 2 dimensions.

Pour pouvoir tester mon algorithme, j'ai choisi SVG pour afficher le résultat. J'ai plusieurs problèmes avec.

Comme mon algorithme peut comporter des entrées et des sorties très différentes, il est essentiel que je puisse visualiser les fichiers SVG générés avec la possibilité d'effectuer un zoom avant!

Mais un chemin en SVG ne peut être affiché qu'avec une certaine largeur. Si je fais un zoom avant, la largeur du chemin devient plus large. Je voudrais que la largeur soit par exemple 1 pixel à tous les niveaux de zoom. Y a-t-il une solution pour cela?

Aussi: peut-on afficher des points SVG? Oui, simple, points bruts.? J'ai constaté qu'il ne pouvait pas.

Merci

Answer 1

De nombreux autres formats vectoriels (tels que PostScript et PDF) vous permettent d’utiliser une largeur de trait de 0 pour un & "; hairline &"; accident vasculaire cérébral. Ce n'est pas le cas avec SVG. Cependant, je pense que vous pouvez obtenir ce que vous voulez si vous utilisez un pourcentage d'épaisseur du trait. Voir les spécifications SVG du w3c pour plus de détails , mais vous devriez au fond être capable de faire quelque chose comme ça:

stroke-width:"1%"

Ceci devrait couvrir votre courbe avec une largeur de trait égale à 1% du rectangle de délimitation, quel que soit le niveau de zoom.

En ce qui concerne les points, SVG ne les prend pas en charge. Dans le passé (avec PostScript), j’avais toujours utilisé un arc avec un petit redius pour dessiner un petit cercle (que vous pouvez remplir pour faire un point, si vous le souhaitez).

@Zoli: Après votre commentaire, j'étais sur le point de vous suggérer de regarder dans PostScript afin que vous puissiez utiliser l'épaisseur du trait du contour des cheveux lorsque je suis tombé sur le effet vectoriel sans mise à l'échelle dans la spécification SVG :

vector-effect="non-scaling-stroke"

Ajoutez simplement ceci à votre courbe et il devrait être invariant à la mise à l'échelle, conformément à la spécification. Leur exemple utilise line, mais cela devrait également fonctionner sur vos courbes.

Answer 2

Il n'y a pas de < point > L'élément ou quelque chose de ce genre dans SVG actuellement, mais l'ajout de cela a été discuté dans le groupe de travail SVG, afin qu'il puisse être inclus dans le futur. N'hésitez pas à exprimer vos besoins et vos exigences pour un & Lt; point & Gt; élément de la liste de diffusion svg publique: www-svg@w3.org.

Une solution consiste à utiliser, par exemple, < line > éléments et laissez-les être de longueur zéro, si vous voulez, vous pouvez avoir des linecaps arrondis pour le faire afficher un point. Tout dépend de ce dont vous avez besoin. Un cercle avec r = 0 pourrait être un meilleur ajustement.

La propriété 'effet vectoriel' avec la valeur 'course non dimensionnelle' est ce que vous devez utiliser pour indiquer que le trait ne doit pas être redimensionné. Il n’est pas si difficile de mettre en œuvre une solution javascript assurant que les traits sont correctement mis à l’échelle si «vector-effect» n’est pas pris en charge de manière native. Opera 9.5+ le prend en charge de manière native.

Answer 3

Merci l'aide Naaff. Je pense que je vais rester avec firefox, et je vais spécifier pour chaque algorithme-exécution la largeur de ligne dans le fichier svg généré. Ce sera suffisant pour moi.