anchor.diff:  
     </div>
     <canvas id="myChart" width="400" height="400"></canvas>
  -<script>
  -var ctx = document.getElementById("myChart");
  -var ctx = document.getElementById("myChart").getContext("2d");
  -var ctx = $("#myChart");
  -var label_list = new Array();
  -var data_list = new Array();
  -<% @vegetable_stocks.to_a.each do |vegetable_stock| %>
  -  label_list.push('<%= vegetable_stock[1] %>');
  -  data_list.push('<%= vegetable_stock[2] %>')
  -<% end %>
  -var myChart = new Chart(ctx, {
  -    type: 'bar',
  -    data: {
  -        labels: label_list,
  -        datasets: [{
  -            label: '手持ちの野菜',
  -            backgroundColor: [
  -                'rgba(255, 99, 132, 0.2)',
  -                'rgba(54, 162, 235, 0.2)',
  -                'rgba(255, 206, 86, 0.2)',
  -                'rgba(75, 192, 192, 0.2)',
  -                'rgba(153, 102, 255, 0.2)',
  -            ],
  -            borderColor: [
  -                'rgba(255,99,132,1)',
  -                'rgba(54, 162, 235, 1)',
  -                'rgba(255, 206, 86, 1)',
  -                'rgba(75, 192, 192, 1)',
  -                'rgba(153, 102, 255, 1)',
  -            ],
  -            borderWidth: 1,
  -            data: data_list,
  -        }]
  -    },
  -    options: {
  -        scales: {
  -            yAxes: [{
  -                ticks: {
  -                    beginAtZero:true
  -                }
  -            }]
  -        }
  -    }
  -});
  -</script>
     <hr>
     <h3 class="recipe_title" style="background-image:url('http://image.space.rakuten.co.jp/d/strg/ctrl/3/07207b43cde4c6476cb8d00ca58f8b3e7be541a9.16.2.3.2.jpg')"><a href="http://recipe.rakuten.co.jp/recipe/1870012115/">★ラブリースパニッシュオムレツ★</a></h3>
     <table class="table">
  
positive.code:   <div class="top_page">
      <ul class="nav nav-pills pull-right">
        <% if @veg_saved == true %>
          <li class="active" id="bought_button">
  
negative.code:       <td>1個</td>
      </tr>
    </table>
  <script>
  var ctx = document.getElementById("myChart");
  var ctx = document.getElementById("myChart").getContext("2d");
  var ctx = $("#myChart");
  
  var label_list = new Array();
  var data_list = new Array();//手持ちの野菜
  var will_list = new Array();//使う予定の野菜
  
  //手持ちの野菜
  <% @vegetable_stocks.to_a.each do |vegetable_stock| %>
    label_list.push('<%= vegetable_stock[1] %>');
    data_list.push('<%= vegetable_stock[2] %>');
  <% end %>
  
  //使う予定の野菜
  //var message = '使う予定の野菜: ';
  <% @vegetable_stocks.to_a.each do |vegetable_stock| %>
    {
      var vegs = document.querySelectorAll('[data-<%= vegetable_stock[0] %>]');
      var veg_count = 0;
      for (veg of vegs) {
         veg_count += parseFloat(veg.dataset.<%= vegetable_stock[0] %>);
      }
  
      will_list.push(veg_count);
      //message += '<%= vegetable_stock[1] %> : ' + veg_count + '個 '
    }
  <% end %>
  var myChart = new Chart(ctx, {
      type: 'radar',
      data: {
          labels: label_list,
          datasets: [{
              label: '手持ちの野菜',
              backgroundColor: [
                  'rgba(255, 99, 132, 0.2)',
                  'rgba(54, 162, 235, 0.2)',
                  'rgba(255, 206, 86, 0.2)',
                  'rgba(75, 192, 192, 0.2)',
                  'rgba(153, 102, 255, 0.2)',
              ],
              borderColor: [
                  'rgba(255,99,132,1)',
                  'rgba(54, 162, 235, 1)',
                  'rgba(255, 206, 86, 1)',
                  'rgba(75, 192, 192, 1)',
                  'rgba(153, 102, 255, 1)',
              ],
              borderWidth: 1,
              data: data_list,
          },
                     {
              label: '使う予定の野菜',
              backgroundColor: [
                  'rgba(153, 102, 255, 0.2)',
                  'rgba(75, 192, 192, 0.2)',
                  'rgba(255, 206, 86, 0.2)',
                  'rgba(54, 162, 235, 0.2)',
                  'rgba(255, 99, 132, 0.2)'
              ],
              borderColor: [
                  'rgba(153, 102, 255, 1)',
                  'rgba(75, 192, 192, 1)',
                  'rgba(255, 206, 86, 1)',
                  'rgba(54, 162, 235, 1)',
                  'rgba(255,99,132,1)'
              ],
              borderWidth: 1,
              data: will_list,
          }
          ]
      },
      options: {
          scales: {
              yAxes: [{
                  ticks: {
                      beginAtZero:true
                  }
              }]
          }
      }
  });
  
  
  </script>
    <!-- /container -->
  