Discussion :

[Amnael]

Bonjour, bonsoir


je voudrais savoir comment faire la chose suivante

J'ai une fonction js qui va interagir avec un de mes canvas.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
function f1(){
  var canvas = document.getElementById('c1');
  if (canvas.getContext){    
    var ctx = canvas.getContext('2d'); 
    ctx.font = "20pt Comic Sans Ms,Calibri,Geneva,Arial";
    ctx.strokeStyle = "rgb(0,0,0)";
    ctx.strokeText("Univers de Shin Sekai Shinobi", 200, 30);
  }  
}

Ce code aura pour effet d'écrire dans mon canvas c1 la phrase du strokeText.


Première question...comment remplir le texte avec une couleur ?
Je sais qu'il y a fillText mais je voudrais garder le principe de la couleur de bordure du stroke également.
Donc en fait l'objectif recherché c'est une bordure de lettre d'une couleur et une couleur de remplissage de lettre différente.



Seconde question; si je veux faire un événement en rapport avec le texte directement et pas seulement le canvas; comment procéder ?
Par exemple changer la couleur du texte. Un simple onmouseover sur le div qui reprends la fonction en changeant juste la couleur serait suffisant ?

[NoSmoking]

Bonjour,
Première question :
il te faut appliquer les méthodes fillStyle puis strokeText avec les mêmes paramètres

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
var x = 200,  y = 30,
    texte = 'Univers de Shin Sekai Shinobi';
 
context.font = '20pt Comic Sans Ms,Calibri,Geneva,Arial';
context.lineWidth = 2;
context.fillStyle = 'yellow';
context.fillText( texte, x, y);
context.strokeStyle = 'black';
context.strokeText( texte, x, y);

Seconde question :
tu as donné la réponse à ta question.


PS : j'en profites pour te demander des nouvelles au sujet cette discussion Evénement sur canvas.

[Amnael]

J'avais oublié l'autre sujet My Bad.

Effectivement j'ai pu m'en sortir. J'ai pas vraiment créer d'objet mais j'ai réussi à déterminer les positions algorithmiquement. Merci de ta réponse par ailleurs bien que je ne la voie que maintenant.



Concernant celui ci; je teste sur le champ : Suspense... et ça a marché !!!

Merci beaucoup !

Je suis bête en fait... j'ai pas pensé qu'en écrivant les deux au même endroit on obtiendrait cet effet là...