Non so perché, ma non riesco a utilizzare un simbolo di "grado" (°) con fillText. Ho provato di tutto: ALT + 248, ALT + 0176, & deg ;, copia/incolla dal web ... Tutto quello che ottengo è nulla o & deg ;. Funziona bene nel codice o sulla stessa pagina in HTML, ma non nella tela.HTML5 Canvas: Degree Symbol
Qualcuno sa come risolvere questo problema? Grazie.
Questo funziona per me, utilizzando un carattere Unicode letterale nel testo. Vedi un esempio qui: http://jsfiddle.net/W5d7D/
è il file sorgente:
Ecco un esempio indipendente che mostra Unicode che funziona in HTML e su Canvas. Si può vedere questo in linea a http://phrogz.net/tmp/canvas_unicode_degree_symbol.html
<!DOCTYPE html>
<html><head>
<meta charset="utf-8">
<title>Unicode Degree Symbol on HTML5 Canvas</title>
<style type="text/css" media="screen">
body { margin:4em; background:#eee; text-align:center }
canvas { background:#fff; border:1px solid #ccc; display:block; margin:2em auto }
</style>
</head><body>
<canvas></canvas>
<p>Unicode characters 'just work' with a proper setup, e.g. "212° Fahrenheit"</p>
<script type="text/javascript" charset="utf-8">
var c = document.getElementsByTagName('canvas')[0];
c.width = c.height = 400;
var ctx = c.getContext('2d');
ctx.font = "bold 24px sans-serif";
ctx.fillText("212° Fahrenheit", 100, 100);
</script>
</body></html>
Assicurati che il tuo JavaScript o editor HTML carattere supporto Unicode. Uso Virsal Studio 2008, ha un problema. Posso scoprire se il tuo editor importa il carattere Unicode corretto con lo script di visualizzazione con chrome inspect.