Dessin d'un rectangle avec des lignes pointillées en utilisant Rafael.js

J'utilise Rafael.js pour dessiner des rectangles sur une image. Mon problème avec la définition de la couleur du trait est que l'arrière-plan peut être sombre ou clair ou de toute couleur. Je pensais que la meilleure façon d'y parvenir serait d'utiliser des lignes pointillées. Cependant cet appelDessin d'un rectangle avec des lignes pointillées en utilisant Rafael.js

circle = Canvas.paper.rect(left, topCoord, width, height).attr({stroke-dasharray:"---"});

ne fonctionne pas. Firebug (sur FireFox 20.0) renvoie un message d'erreur indiquant qu'une fonction existante dans mon fichier .js n'existe pas. Il semble que stroke-dasharray n'est pas valide pour les rectangles.

Source

2013-04-09 OtagoHarbour

erreur de base JavaScript:

{stroke-dasharray:"---"}

devrait être:

{"stroke-dasharray":"---"}

aussi: "---" n'est pas une valeur prise en charge pour stroke-dasharray; il devrait être:

{"stroke-dasharray":"--"}

Source

2013-04-09 20:56:49 searlea

Merci. Cela a fait disparaître l'erreur mais j'obtiens toujours des lignes noires pleines pour le rectangle. Merci, Peter. – OtagoHarbour

En regardant la [référence Raphael] (http://raphaeljs.com/reference.html) Je ne pense pas que trois tirets soient une option valide. Essayez deux: '" - "' – searlea

Cela a fonctionné pour obtenir des lignes pointillées. Merci beaucoup! Pour obtenir deux couleurs différentes, il me semble avoir besoin de deux appels: l'un avec {"stroke-dasharray": "-"} et l'autre avec {"stroke": "white", "stroke-dasharray": "- .." } Merci beaucoup! – OtagoHarbour

Non « --- », course-dasharray possible: [“”, “-”, “.”, “-.”, “-..”, “. ”, “- ”, “--”, “- .”, “--.”, “--..”]

Une façon de colorer la course est d'utiliser le HSV ou de l'espace HSL, puis choisissez le contraire (ou à proximité) spectre. Essayez les réponses de: Given an RGB value, how do I create a tint (or shade)?

Source

2013-04-09 21:36:54

Intéressant. Je pense que l'idéal serait de xor avec l'image sous-jacente mais Rafael ne semble pas avoir cette option. Merci, Peter. – OtagoHarbour

Certains navigateurs peuvent supporter la manipulation pour créer un éclat autour de lui. Essayez http://commons.oreilly.com/wiki/index.php/SVG_Essentials/Filters –

Dessin d'un rectangle avec des lignes pointillées en utilisant Rafael.js

Répondre

Questions connexes