ChartJs未显示顶部标签

时间:2020-09-22 15:46:46

标签: php chart.js

我的chartjs没有显示标签标题,但是我检查了所有代码,我没有什么错,some1可以帮助我修复它吗?我已经设置了图例显示:True

请忽略此单词,因为它不够用,所以我输入了一些内容以扩展dsadasdnakdjakdakdakdkaldjlasjdladasdasdasdsadsadsadsadasdsa sAFAASD DCSDCAS CDECADA

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8" />
  <script src='https://cdnjs.cloudflare.com/ajax/libs/Chart.js/1.0.2/Chart.min.js'></script>
</head>

    <h1 class="header" align="center">Dashboard of Depression</h1>
    <table>
        <tr>
            <td>
            <body>
              <center>
                <h3>{{ title2 }}</h3>
              </center>
              <center>
                <canvas id="chart1" width="500" height="300"></canvas>
                <script>
                  // bar chart data
                  var barData = {
                    labels : [
                      {% for item in label2 %}
                       "{{ item }}",
                      {% endfor %}
                ],

                    datasets : [{
                      label: "Red",
                      fill: true,
                      fillColor: "rgba(196, 93, 105, 0.3)",
                      strokeColor: "rgba(196, 93, 105, 0.3)",
                      pointColor: "rgba(196, 93, 105, 0.3)",
                      data : [
                        {% for item in value2 %}
                           "{{ item }}",
                          {% endfor %}
                    ]
                      },
                      {
                      label: "Blue",
                      fill: true,
                      fillColor: "rgba(151,187,205,0.2)",
                      strokeColor: "rgba(151,187,205,1)",
                      pointColor: "rgba(151,187,205,1)",
                      data : [
                        {% for item in value4 %}
                           "{{ item }}",
                          {% endfor %}
                    ]
                      }
                    ]
                  }

                 // get bar chart canvas
                 var mychart = document.getElementById("chart1").getContext("2d");

                   steps = 10
                   max = {{max4}}

                 // draw bar chart
                 new Chart(mychart).Line(barData, {
                   scaleOverride: true,
                   scaleSteps: steps,
                   scaleStepWidth: Math.ceil(max / steps),
                   scaleStartValue: 0,
                   scaleShowVerticalLines: true,
                   scaleShowGridLines : true,
                   barShowStroke : true,
                   scaleShowLabels: true,
                   xAxes: [{ stacked: true }],
                   yAxes: [{ stacked: true }],
                   legend: {display: true}
                   }
                 );

                </script>
              </center>
            </body>
            </td>
        </tr>
     </table>
<style>
table, th, td {
  border: 1px solid black;
}
</style>

my graph

what i want

1 个答案:

答案 0 :(得分:0)

解决:未显示ChartJS的原因。 chart.js是旧版本。需要将其更改为最新版本