Question

我不知道为什么但我无法在fillText中使用“度”符号（°）。我尝试了所有的东西：ALT + 248，ALT + 0176，＆amp; deg;，从网上复制/粘贴...我得到的只是什么或者＆amp; deg;。在HTML中的代码或同一页面上运行良好 - 只是不在画布中。

任何人都知道如何解决这个问题？感谢。

Answer 1

这适用于我，在文本中使用文字Unicode字符。在这里查看示例： http://jsfiddle.net/W5d7D/

是您的源文件：

保存为UTF-8和
描述为使用Unicode字符集和
将JavaScript源描述为使用Unicode字符集？

这是一个独立的示例，显示了使用HTML和Canvas工作的Unicode。您可以在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>

Answer 2

确保您的javascript或html编辑器支持Unicode字符。我使用Virsal Studio 2008，它有问题。我可以通过chrome inspect查看脚本是否导入了正确的Unicode字符。

HTML5画布：度符号

2 个答案: