title: Canvas is not showing chart on the page
body: <p>I have different charts in system to visualize feedback data using Canvas and ChartJs.All other  visualizations of feedbacks like student , faculty etc are visible but graduate feedback data is not being visualized.</p>
  <p>Below is the code not that is not visualizing the charts</p>
  <pre><code>   &lt;h3 style=&quot;text-align: center; background-color: lightgrey;&quot;&gt;Graduate Student Feedback Visualization&lt;/h3&gt;
  
          &lt;canvas id=&quot;graduate-chart1&quot; class=&quot;mx-auto&quot; style=&quot;width:100%;max-width:600px&quot;&gt;&lt;/canvas&gt;
          &lt;br&gt; 
          &lt;canvas id=&quot;graduate-chart2&quot; class=&quot;mx-auto&quot; style=&quot;width:100%;max-width:600px&quot;&gt;&lt;/canvas&gt;
          &lt;br&gt;
          &lt;canvas id=&quot;graduate-chart3&quot; class=&quot;mx-auto&quot; style=&quot;width:100%;max-width:600px&quot;&gt;&lt;/canvas&gt;
          &lt;br&gt;
          &lt;canvas id=&quot;graduate-chart4&quot; class=&quot;mx-auto&quot; style=&quot;width:100%;max-width:600px&quot;&gt;&lt;/canvas&gt;
          &lt;br&gt;
          &lt;canvas id=&quot;graduate-chart5&quot; class=&quot;mx-auto&quot; style=&quot;width:100%;max-width:600px&quot;&gt;&lt;/canvas&gt;
          //upto 16
          &lt;canvas id=&quot;graduate-chart16&quot; class=&quot;mx-auto&quot; style=&quot;width:100%;max-width:600px&quot;&gt;&lt;/canvas&gt;
         
  </code></pre>
  <p>Here is the script</p>
  <pre><code>&lt;script&gt;
  
          var xValues = [&quot;very satisfied&quot;, &quot;satisfied&quot;, &quot;neutral&quot;, &quot;dissatisifed&quot;, &quot;very dissatified&quot;];
          var yValues = {{ Graduate_Feedback_data }};
          var barColors = [
              &quot;#b91d47&quot;,
              &quot;#00aba9&quot;,
              &quot;#2b5797&quot;,
              &quot;#e8c3b9&quot;,
              &quot;#1e7145&quot;
          ];
  
          graduate_questionnaire = [&quot;The work in the program is too heavy and induces a lot of pressure.&quot;,
                                  &quot;The program is effective in enhancing team- working abilities.&quot;,
                                   /// some more questions here
                                  &quot;Discipline&quot;,
                                  &quot;The link between theory and practice&quot;]
          graduate_chart_ids = [&quot;graduate-chart1&quot;, &quot;graduate-chart2&quot;, &quot;graduate-chart3&quot;, &quot;graduate-chart4&quot;, &quot;graduate-chart5&quot;, &quot;graduate-chart6&quot;, &quot;graduate-chart7&quot;, &quot;graduate-chart8&quot;, &quot;graduate-chart9&quot;,&quot;graduate-chart10&quot;, &quot;graduate-chart11&quot;, &quot;graduate-chart12&quot;, &quot;graduate-chart13&quot;,&quot;graduate-chart14&quot;,&quot;graduate-chart15&quot;,'graduate-chart16']
          for (let i = 0; i &lt; graduate_chart_ids.length; i++) {
              new Chart(graduate_chart_ids[i], {
                  type: &quot;pie&quot;,
                  data: {
                      labels: xValues,
                      datasets: [{
                          backgroundColor: barColors,
                          data: yValues[i]
                      }]
                  },
                  options: {
                      title: {
                          display: true,
                          text: graduate_questionnaire[i]
                      }
                  }
  
              }
  
              )
          }
      &lt;/script&gt;
  </code></pre>