Question

图表工作正常但是看不到工具提示... 我无法找到问题所在和错过的地方......

<div style="width: 1000px; height: 600">
<canvas id="myChart" ></canvas>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.4.0/Chart.min.js"></script>
<script>
    var ctx = document.getElementById("myChart").getContext('2d');
    var myNewChart = new Chart(ctx, {
        type: 'line',
        data: {
            labels: ["24.5.2018. 15:23:48", "24.5.2018. 16:00:00", "24.5.2018. 17:00:00", ],
            datasets: [{
                label: '# Temperature',
                fill: false,
                data: [29, 25, 24,  ],
                backgroundColor: [
                               ],
                borderColor: [
                               ],
                borderWidth: 1
            }, {
                label: '# Humidity',
                data: [54, 62, 64,  ],
                borderColor: [
          ],
                borderWidth: 1,
                fill: false,
                type: 'line'
            }
        ]
        },
    options: {
    legend: {
      display: true,
      position: 'top',
      labels: {
        boxWidth: 80,
        fontColor: 'rgb(60, 180, 100)'
      }
    },
    tooltips: {
      cornerRadius: 4,
      caretSize: 4,
      xPadding: 16,
      yPadding: 10,
      backgroundColor: 'rgba(0, 150, 100, 0.9)',
      titleFontStyle: 'normal',
      titleMarginBottom: 15
    }
  }
    });
</script>

我需要帮助种子添加更多文本用于发布此内容，但不要知道简单的问题如何更长...文本文本我需要的助手种子添加更多文本用于发布此内容但是不要知道多么简单的问题会更长... ...

Answer 1

尝试this一个

<div style="width: 1000px; height: 600">
  <canvas id="myChart"></canvas>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.4.0/Chart.min.js"></script>
<script>
  var ctx = document.getElementById("myChart").getContext('2d');
  var myNewChart = new Chart(ctx, {
    type: 'line',
    data: {
      labels: ["24.5.2018. 15:23:48", "24.5.2018. 16:00:00", "24.5.2018. 17:00:00", ],
      datasets: [{
        label: '# Temperature',
        fill: false,
        data: [29, 25, 24, ],
        borderWidth: 1
      }, {
        label: '# Humidity',
        data: [54, 62, 64, ],
        borderWidth: 1,
        fill: false,
        type: 'line'
      }]
    },
    options: {
      legend: {
        display: true,
        position: 'top',
        labels: {
          boxWidth: 80,
          fontColor: 'rgb(60, 180, 100)'
        }
      },
      tooltips: {
        cornerRadius: 4,
        caretSize: 4,
        xPadding: 16,
        yPadding: 10,
        backgroundColor: 'rgba(0, 150, 100, 0.9)',
        titleFontStyle: 'normal',
        titleMarginBottom: 15
      }
    }
  });

</script>

只需从两个数据集中删除backgroundColor: []和borderColor: []

Chart.js工具提示未显示

1 个答案: