條形圖中的Chart.js顏色未顯示

Question

我有一個chart.js條形圖，該條形圖在桌面上可以很好地顯示，但是在我的iPhone上，除非我將鼠標懸停在其上，然后只有WAY條變為正確的顏色，否則該條形圖是黑色的。 碼：

<div class="col-sm">
            <canvas id="WayChart" width="300" height="300"></canvas> <!-- max-width="100%" -->
                <script>
                    var densityCanvas = document.getElementById("WayChart");

                    Chart.defaults.global.defaultFontSize = 18;
                    Chart.defaults.global.defaultFontColor='black';

                    var controlData = {
                      label: 'Control',
                      data: [5.0,4.2,5.6],
                      backgroundColor: 'rgba(144,18,179)',
                      borderWidth: 0,
                      yAxisID: "WAY Depth"
                    };

                    var wayData = {
                      label: 'WAY',
                      data: [5.3,2.5,2.6],
                      backgroundColor: 'rgba(0,166,104)',
                      borderWidth: 0,
                      yAxisID: "WAY Depth"
                    };

                    var daysData = {
                      labels: ["Day 0", "Day 28", "Day 56"],
                      datasets: [controlData, wayData],
                    };

                    var chartOptions = {
                      responsive:true,
                      scales: {
                        xAxes: [{
                          barPercentage: 1,
                          categoryPercentage: 0.5,
                            ticks: {
                                fontStyle:'bold'
                            }
                        }],
                        yAxes: [{
                          id: "WAY Depth",
                            scaleLabel:{
                                display:true,
                                labelString:'Depth (mm)',
                                fontStyle:'bold',
                            },
                          ticks: {
                              beginAtZero: true
                          }
                        }]
                      },

                        title:{
                            display:'true',
                            text:'Depth Measurements (mm)',
                            fontSize:18
                        }
                    };

                    var barChart = new Chart(WayChart, {
                      type: 'bar',
                      data: daysData,
                      options: chartOptions
                    });
                </script>
        </div>
    </div>  

有任何想法嗎？ 它可以在Chrome手機檢查器窗口中正常顯示，但在使用FF和Chrome瀏覽器的iPhone上卻無法顯示。

Answer 1

發布此消息后，我立即看到了問題。 backgroundColor是使用rgba編寫的，需要為rgb。 總是小事...