質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.46%
Chart.js

Chart.jsは、多様なグラフを組み込めるJavaScriptのライブラリ。折れ線グラフや棒グラフ、円グラフ、レーダーチャートなどのグラフの種類が用意されています。HTML5のCanvasを用いて描画され、マークアップも分かりやすく、簡単に編集することが可能です。

Q&A

0回答

1565閲覧

chart.jsで文字化け

bluesoul

総合スコア2

Chart.js

Chart.jsは、多様なグラフを組み込めるJavaScriptのライブラリ。折れ線グラフや棒グラフ、円グラフ、レーダーチャートなどのグラフの種類が用意されています。HTML5のCanvasを用いて描画され、マークアップも分かりやすく、簡単に編集することが可能です。

0グッド

1クリップ

投稿2020/08/18 08:23

日本語が文字化けするのはなぜでしょうか?

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.1.4/Chart.min.js"></script>

<canvas id="myChart"></canvas>

<script> var ctx = document.getElementById("myChart").getContext('2d'); var myChart = new Chart(ctx, { type: 'pie', data: { labels: ["あああ", "T", "W", "T", "F", "S", "S"], datasets: [{ backgroundColor: [ "#2ecc71", "#3498db", "#95a5a6", "#9b59b6", "#f1c40f", "#e74c3c", "#34495e" ], data: [12, 19, 3, 17, 28, 24, 7] }] } }); </script>![![イメージ説明](1bf30c3693f30084a4df0920ba83088d.png)](80c9f9ac5d50ade720b1d24170fcd74b.png)

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

nekoniki

2020/08/18 08:36

ぱっと見文字コードが異なるからのような気がしますが・・・ HTMLの文字コードや、文字化けするブラウザを教えていただければ原因がわかるかもしれません。
bluesoul

2020/08/18 09:03

ご返信ありがとうございます。 ワードプレス(バージョン 5.5–ja )ですが <!DOCTYPE html> <html class="pc" lang="ja"> <head> <meta charset="UTF-8"> <!--[if IE]><meta http-equiv="X-UA-Compatible" content="IE=edge"><![endif]--> <meta name="viewport" content="width=device-width"> でchrome表示です。ほかのプラウザでも同じです。
Daregada

2020/08/18 11:23

WordPressを使わずに、上記の文書型定義からhead要素までを書き、bodyの中に質問で提示されたscript要素などを書いたHTMLファイルを作成したら、文字化けしないで表示されましたよ。ご自分でも確かめてみては。
bluesoul

2020/08/18 13:02

ご返信ありがとうございました。 自分でもhtmlで確認はしております。ただワードプレスの環境でどうして起こるのか…
dameo

2020/08/20 10:49

ワードプレスはカスタマイズ範囲がかなり広い上、本体を改造する人もいるので、「ワードプレスの環境」と一括りにされても誰も回答できないと思いますよ。置き方だって人それぞれですし。 ようは本当に理由を知りたいのであれば、あなたの環境を見せて頂くのが手っ取り早いということで、それよりも早いのはあなた自身が詳しくなってご自分で調べられることです。 HTMLファイルのエンコーディングは基本HTTPヘッダのContent-Typeか、HTML内のMETAタグで決まる仕様です。最初に調べるべきはご自分が利用されているサーバーがそれぞれ何を返しているかですね。それが分かったら、問題となっている方の出力原因を追っていけば、最終的な犯人が分かると思いますよ。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだ回答がついていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.46%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問