Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

191
Visualizações
Displaying D3.js Chart with Django Backend

I am learning to build dashboard using Django as backend and D3.js for visualization.

Following is my index.html:

{% load static %}
<html>
<script src="https://d3js.org/d3.v7.min.js"></script>
<body> 
    <h1> Hello! </h1>
    <script src={% static "js\linechart.js" %}>
        var data = {{ AAPL|safe }};
        
        
        var chart = LineChart(data, {
        x: d => d.date,
        y: d => d.close,
        yLabel: "↑ Daily close ($)",
        width,
        height: 500,
        color: "steelblue"
      })
    
    </script>    
</body>
</html>

Data AAPl is extracted from database and the views.py is as follows:

from django.shortcuts import render
from django.http import HttpResponse
from cnxn import mysql_access
import pandas as pd

# Create your views here.
def homepage(request):
    sql = ''' select Date, Close from tbl_historical_prices where ticker = 'AAPL' '''
    cnxn = mysql_access()
    conn = cnxn.connect()
    df = pd.read_sql(sql, con=conn)
    context = {'AAPL':df.to_json()}
    return render(request, 'index.html', context=context)

Function line chart can be viewed here which is being used in js\linechat.js in index.html file.

I can see the Hello! being displayed on the page but can't see the line chart. I am unable to debug the problem. No errors found in console tab either.

How can I display the line plot?

I've added the current page display in attached image.

enter image description here

about 4 years ago · Juan Pablo Isaza
1 Respostas
Responde à pergunta

0

Close off your script with a src and start a new script tag. The presence of src precludes internal code.

<script src={% static "js\linechart.js" %}></script>
<script>
...
about 4 years ago · Juan Pablo Isaza Relatório
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda