質問編集履歴
3
タグ追加
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -176,6 +176,7 @@
|
|
|
176
176
|
|
|
177
177
|
|
|
178
178
|
下記のようにデータを直接、Javascriptでのグラフを表示する処理部分に入力するとラベルも数値も反映されます。
|
|
179
|
+
各評価のラベルは今の所記事ごとに変える予定がないので、この方法を使えばうまくいきそうです。
|
|
179
180
|
|
|
180
181
|
```footer-3.php
|
|
181
182
|
data: {
|
2
綴り間違い訂正
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -143,12 +143,12 @@
|
|
|
143
143
|
<canvas id="radarChart"></canvas>
|
|
144
144
|
<?php if( get_field('chart') ): ?>
|
|
145
145
|
<!-- ↓この下六行がエラーメッセージの73行目~78行目 -->
|
|
146
|
-
<p class="star star<?php the_field('chart')['
|
|
146
|
+
<p class="star star<?php the_field('chart')['chart1']; ?>">(<?php the_field('chart')['chart1']; ?>)</p>
|
|
147
|
-
<p class="star star<?php the_field('chart')['
|
|
147
|
+
<p class="star star<?php the_field('chart')['chart2']; ?>">(<?php the_field('chart')['chart2']; ?>)</p>
|
|
148
|
-
<p class="star star<?php the_field('chart')['
|
|
148
|
+
<p class="star star<?php the_field('chart')['chart3']; ?>">(<?php the_field('chart')['chart3']; ?>)</p>
|
|
149
|
-
<p class="star star<?php the_field('chart')['
|
|
149
|
+
<p class="star star<?php the_field('chart')['chart4']; ?>">(<?php the_field('chart')['chart4']; ?>)</p>
|
|
150
|
-
<p class="star star<?php the_field('chart')['
|
|
150
|
+
<p class="star star<?php the_field('chart')['chart5']; ?>">(<?php the_field('chart')['chart5']; ?>)</p>
|
|
151
|
-
<p class="star star<?php the_field('chart')['
|
|
151
|
+
<p class="star star<?php the_field('chart')['chart6']; ?>">(<?php the_field('chart')['chart6']; ?>)</p>
|
|
152
152
|
<?php endif; ?>
|
|
153
153
|
</div>
|
|
154
154
|
```
|
1
エラーメッセージの原因、チャートの下に表示させたい☆（星）関連のコードを追加。
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -4,8 +4,18 @@
|
|
|
4
4
|
サブフィールドは6つ作成し、0~5で評価できる六角形のレーダーチャートにします。
|
|
5
5
|
このグラフ自体のタイトルは表示させませんが、各項目の名前(サブフィールドのラベル)はそれぞれの頂点部分に表示させたいです。
|
|
6
6
|
|
|
7
|
+
チャートの下には星の数で評価内容を表示したいです。
|
|
8
|
+
例「①評価１
|
|
9
|
+
★★★☆☆(3)
|
|
10
|
+
②評価２
|
|
11
|
+
★★★☆☆(3)
|
|
12
|
+
・・・」
|
|
7
|
-
|
|
13
|
+
現在、cssの:beforeを使って、星のみ表示させるようにコードを書いています。
|
|
8
14
|
|
|
15
|
+
また、チャートの大きさの調整もしたいのですが、やり方も調べても出てこず、できていません。
|
|
16
|
+
widthだとその半分の大きさで中央に表示されます。
|
|
17
|
+
目盛や数字、点の大きさも調節できるのでしょうか。
|
|
18
|
+
|
|
9
19
|
**ACFの設定**
|
|
10
20
|
<フィールド>
|
|
11
21
|
フィールドラベル：チャート
|
|
@@ -21,7 +31,7 @@
|
|
|
21
31
|
|
|
22
32
|
### 発生している問題・エラーメッセージ
|
|
23
33
|
|
|
24
|
-
レーダーチャートの0の部分に点が打たれて、ラベル
|
|
34
|
+
レーダーチャートの0の部分に点が打たれて、ラベルとデータが反映されません。
|
|
25
35
|
データを取得して配列に入れる部分、もしくは取り出す部分がどこかで間違っていると思います。
|
|
26
36
|
|
|
27
37
|
|
|
@@ -32,8 +42,9 @@
|
|
|
32
42
|
Notice: Trying to access array offset on value of type null in (ファイルの場所)/single-product.php on line 73 )
|
|
33
43
|
```
|
|
34
44
|
|
|
35
|
-
3,3,3,3,3,3というのはサブフィールドで入力した5点満点の数字が入っています。
|
|
45
|
+
3,3,3,3,3,3というのはサブフィールドで入力した5点満点の数字がちゃんと入っています。
|
|
36
46
|
６項目分、行数の部分のみ変わって繰り返し表示されます。
|
|
47
|
+
チャート下の、星の数を表示させる部分のエラーです。
|
|
37
48
|
|
|
38
49
|
また時々、処理が重いのかグラフ自体が表示されなくなります。
|
|
39
50
|
リロードした時や、コードを書いたり調べたりしてしばらく放置していると起こります。
|
|
@@ -43,7 +54,7 @@
|
|
|
43
54
|
|
|
44
55
|
### 該当のソースコード
|
|
45
56
|
|
|
46
|
-
header、footer、表示する記事(single-product.php)の、
|
|
57
|
+
header、footer、表示する記事(single-product.php)、theme_style.cssの、四つを編集しました。
|
|
47
58
|
header、footerはchart表示用に別に作ったので「-3」がファイル名についています。
|
|
48
59
|
|
|
49
60
|
↓header-3.php
|
|
@@ -128,10 +139,33 @@
|
|
|
128
139
|
↓single-product.php
|
|
129
140
|
|
|
130
141
|
```php
|
|
142
|
+
<div class="article-evaluation">
|
|
131
|
-
<canvas id="radarChart"></canvas>
|
|
143
|
+
<canvas id="radarChart"></canvas>
|
|
144
|
+
<?php if( get_field('chart') ): ?>
|
|
145
|
+
<!-- ↓この下六行がエラーメッセージの73行目~78行目 -->
|
|
146
|
+
<p class="star star<?php the_field('chart')['cart1']; ?>">(<?php the_field('chart')['cart1']; ?>)</p>
|
|
147
|
+
<p class="star star<?php the_field('chart')['cart1']; ?>">(<?php the_field('chart')['cart1']; ?>)</p>
|
|
148
|
+
<p class="star star<?php the_field('chart')['cart1']; ?>">(<?php the_field('chart')['cart1']; ?>)</p>
|
|
149
|
+
<p class="star star<?php the_field('chart')['cart1']; ?>">(<?php the_field('chart')['cart1']; ?>)</p>
|
|
150
|
+
<p class="star star<?php the_field('chart')['cart1']; ?>">(<?php the_field('chart')['cart1']; ?>)</p>
|
|
151
|
+
<p class="star star<?php the_field('chart')['cart1']; ?>">(<?php the_field('chart')['cart1']; ?>)</p>
|
|
152
|
+
<?php endif; ?>
|
|
153
|
+
</div>
|
|
132
154
|
```
|
|
133
155
|
|
|
156
|
+
↓theme_style.css
|
|
134
157
|
|
|
158
|
+
```css
|
|
159
|
+
.star:before {color:#60554C;}
|
|
160
|
+
.star5:before {content:'★★★★★';}
|
|
161
|
+
.star4:before {content:'★★★★☆';}
|
|
162
|
+
.star3:before {content:'★★★☆☆';}
|
|
163
|
+
.star2:before {content:'★★☆☆☆';}
|
|
164
|
+
.star1:before {content:'★☆☆☆☆';}
|
|
165
|
+
.star0:before {content:'☆☆☆☆☆';}
|
|
166
|
+
```
|
|
167
|
+
|
|
168
|
+
|
|
135
169
|
### 試したこと
|
|
136
170
|
|
|
137
171
|
[【WordPress】Advanced Custom Fields PROで入力したデータをChart.jsのグラフに使用して、ショートコード化したついでにクイックタグ化する](https://mykii.blog/wordpress-advanced-custom-fields-pro-chartjs/)
|