Chart.js javascript из db перестал работать после добавления осей

Я новичок в chart.js.

Данные поступают из базы данных, а приведенный ниже код генерируется процедурно.

Мне удалось разбросать график только по одной оси, но теперь, когда я добавил больше осей y, я получаю сообщение об ошибке в консоли инспектора хрома, graphPage.html:90 Uncaught SyntaxError: Unexpected token {.

Пытался вырезать части скрипта, но ошибок больше. Когда я рассматриваю это в Sublime Text 2, скобки кажутся совпадающими.

Пропавший токен - я его еще не нашел. Спасибо.

<html>
<head>
<style type = "text/css">

body { 
  background:#FFFFFF;
  padding: 5px;
}

h4 { 
  text-align: center;
  font-size: 20vw;
}

.chart-container {
    position: relative;
    margin: auto;
    height: 350px;
    width: 400px;
}

</style></head>

  <body>
    <h4>Batch cost for ISOPROPANOL pct.</h4>
    <div class = "chart-container">
        <canvas id = "myChart"></canvas>
    </div>
  </body>
</html>
<script src = "https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.4.0/Chart.min.js"></script>
<script type = "text/javascript">
     var ctx=document.getElementById('myChart').getContext('2d');
     var chart=new Chart(ctx, {

     type: 'scatter',
     data: {
          datasets: [{
               label: 'A',
               yAxisID: 'A',
               fill: false,
               borderColor: 'rgb(26, 54, 99)',
               data: [
                 {x: 5, y: 16721.8914969083}, 
                 {x: 10, y: 15901.5550392998}, 
                 {x: 15, y: 15081.2185816913}, 
                 {x: 20, y: 14260.8821240829}, 
                 {x: 25, y: 13440.5456664744}, 
                 {x: 30, y: 12620.2092088659}, 
                 {x: 35, y: 11799.8727512574}, 
                 {x: 40, y: 10979.5362936489}, 
                 {x: 45, y: 10159.1998360404}, 
                 {x: 50, y: 9338.86337843194}, 
                 {x: 55, y: 8518.52692082345}, 
                 {x: 60, y: 7698.19046321496}, 
                 {x: 65, y: 6877.85400560647}, 
                 {x: 70, y: 6057.51754799798}, 
                 {x: 75, y: 5237.1810903895}, 
                 {x: 80, y: 4416.84463278101}, 
                 {x: 85, y: 3596.50817517252}, 
                 {x: 90, y: 2776.17171756404}, 
                 {x: 95, y: 1955.83525995555}
                     ]
                         }, {
               label: 'B',
               yAxisID: 'B',
               fill: false,
               borderColor: 'rgb(35, 99, 69)',
               data: [
                 {x: 5, y: 56.7749401173531}, 
                 {x: 10, y: 113.549880234706}, 
                 {x: 15, y: 170.324820352059}, 
                 {x: 20, y: 227.099760469412}, 
                 {x: 25, y: 283.874700586765}, 
                 {x: 30, y: 340.649640704119}, 
                 {x: 35, y: 397.424580821472}, 
                 {x: 40, y: 454.199520938825}, 
                 {x: 45, y: 510.974461056178}, 
                 {x: 50, y: 567.749401173531}, 
                 {x: 55, y: 624.524341290884}, 
                 {x: 60, y: 681.299281408237}, 
                 {x: 65, y: 738.07422152559}, 
                 {x: 70, y: 794.849161642943}, 
                 {x: 75, y: 851.624101760297}, 
                 {x: 80, y: 908.39904187765}, 
                 {x: 85, y: 965.173981995003}, 
                 {x: 90, y: 1021.94892211236}, 
                 {x: 95, y: 1078.72386222971}
                     ]
          }]
     },
     options: {
         responsive: true,
         maintainAspectRatio: false,
         legend: {
              display: false
                      }, 
          scales: {
               xAxes: [{
                    type: 'linear',
                    position: 'bottom',
                    scaleLabel: {
                        display: true, 
                        labelString: 'Concentration, percent' 
                         },
                    ticks: {
                         min: 0,
                         max: 100
                         }
               }],
               yAxes: [{
                    id: 'A',
                    type: 'linear',
                    position: 'left',
                    scaleLabel: {
                        display: true, 
                        labelString: 'Batch cost $' 
                         },
                    ticks: {
                         min: 0
                         }, {
                    id: 'B',
                    type: 'linear',
                    position: 'right',
                    scaleLabel: {
                        display: true, 
                        labelString: 'Ingr cost $' 
                         },
                    ticks: {
                         min: 0
                         }
                     }
               }]
            }
     } 
 }); 
</script>

javascript chart.js

15.03.2018 21:02

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией

В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.

Концепция локализации и ее применение в приложениях React ⚡️

Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...

Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer

В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...

Безумие обратных вызовов в javascript [JS]

Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...

Система управления парковками с использованием HTML, CSS и JavaScript

Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...

JavaScript Вопросы с множественным выбором и ответы

Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...