お世話になります。
Jsをさわり初めて1週間の初心者です。
D3.jsで図を表示しようとしています。
1つめの図は表示できたのですが、同じコードをコピーしても2つめの図を表示させようとしても表示されません。
動いた例
html
1<svg id="fillgauge1" width="97%" height="100" onclick="gauge1.update(NewValue());"></svg> 2 <?php 3 $a = $item->kcal; 4 $b = $a/5; 5 ?> 6 <script language="JavaScript"> 7 var config1 = liquidFillGaugeDefaultSettings(); 8 config1.circleColor = "#FFB6B9"; 9 config1.textColor = "#BBDED6"; 10 config1.waveTextColor = "#BBDED6"; 11 config1.waveColor = "#61C0BF"; 12 config1.circleThickness = 0.2; 13 config1.circleFillGap = 0; 14 config1.textVertPosition = 0.5; 15 config1.waveAnimateTime = 2000; 16 config1.waveHeight = 0.3; 17 config1.waveCount = 1; 18 var gauge1 = loadLiquidFillGauge("fillgauge1", "<?= $b; ?>", config1); 19 </script>
2つ同じコードを並べても動かない例
html
1<svg id="fillgauge1" width="97%" height="100" onclick="gauge1.update(NewValue());"></svg> 2 <?php 3 $a = $item->kcal; 4 $b = $a/5; 5 ?> 6 <script language="JavaScript"> 7 var config1 = liquidFillGaugeDefaultSettings(); 8 config1.circleColor = "#FFB6B9"; 9 config1.textColor = "#BBDED6"; 10 config1.waveTextColor = "#BBDED6"; 11 config1.waveColor = "#61C0BF"; 12 config1.circleThickness = 0.2; 13 config1.circleFillGap = 0; 14 config1.textVertPosition = 0.5; 15 config1.waveAnimateTime = 2000; 16 config1.waveHeight = 0.3; 17 config1.waveCount = 1; 18 var gauge1 = loadLiquidFillGauge("fillgauge1", "<?= $b; ?>", config1); 19 </script> 20 <svg id="fillgauge1" width="97%" height="100" onclick="gauge1.update(NewValue());"></svg> 21 <?php 22 $a = $item->kcal; 23 $b = $a/5; 24 ?> 25 <script language="JavaScript"> 26 var config1 = liquidFillGaugeDefaultSettings(); 27 config1.circleColor = "#FFB6B9"; 28 config1.textColor = "#BBDED6"; 29 config1.waveTextColor = "#BBDED6"; 30 config1.waveColor = "#61C0BF"; 31 config1.circleThickness = 0.2; 32 config1.circleFillGap = 0; 33 config1.textVertPosition = 0.5; 34 config1.waveAnimateTime = 2000; 35 config1.waveHeight = 0.3; 36 config1.waveCount = 1; 37 var gauge1 = loadLiquidFillGauge("fillgauge1", "<?= $b; ?>", config1); 38 </script>
ご教授の程よろしくお願い申し上げます。
回答1件
あなたの回答
tips
プレビュー