Как использовать данные из БД (flask_sqlalchemy) для отображения их в графике зависимости через js

приложение написано на flask на странице должен быть график зависимости: сколько потрачено денег (article.price) и даты этой траты (article.date.date()), все это находится в БД, но нужно использовать все эти данные в JS для построения графика. Пытался просто вставить данные через jinja но она ругается. попытка:

  <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/chart.min.js"></script>
  <script>
    let ctx = document.querySelector('#myChart').getContext('2d');
    function data(data_price){
        console.log(data_price);
    }
    let myChart = new Chart(ctx, {
        type: 'line',
        data: {
            labels: [{{article.date.date()}}],
            datasets: [{
                label: 'заголовок',
                data: [{{article.price}}],
                backgroundColor: [
                    'white'
                ],
                borderColor: [
                    '#000',
                    '#000',
                    '#000',
                    '#000',
                    '#000'
                ],
                borderWidth: 4
            }]
        },
        options: {},
    })
  </script>

График строится с помощью CDN и находится в HTML документе index.html:

  <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/chart.min.js"></script>
  <script>
    let ctx = document.querySelector('#myChart').getContext('2d');
    function data(data_price){
        console.log(data_price);
    }
    let myChart = new Chart(ctx, {
        type: 'line',
        data: {
            labels: ['ТУТ ДОЛЖНЫ БЫТЬ ДАТЫ (article.date.date())'],
            datasets: [{
                label: 'заголовок',
                data: ['ТУТ ДОЛЖНЫ БЫТЬ ТРАТЫ (article.price)'],
                backgroundColor: [
                    'white'
                ],
                borderColor: [
                    '#000',
                    '#000',
                    '#000',
                    '#000',
                    '#000'
                ],
                borderWidth: 4
            }]
        },
        options: {},
    })
  </script>

вот функция вызова страницы:

# функция основной страницы


    @app.route('/')
    def index():
        article = Article.query.order_by(Article.date.desc()).all()
        return render_template("index.html", article=article)

вот БД, на всякий случай:

class Article(db.Model):
    """
    Создаю БД для внесения продуктов и их цен
    """
    id = db.Column(db.Integer, primary_key=True)
    date = db.Column(db.DateTime, default=datetime.utcnow)
    product = db.Column(db.String(50), nullable=True)
    price = db.Column(db.Integer)

    def __repr__(self) -> str:
        return '<Article %r>' % self.id

Ответы (0 шт):