График не отображается на фреймворке django
Я хочу отобразить график, используя библиотеку C3 Javascript, которая отображает будущие цены на текстильное сырье на фреймворке django. Когда я запускаю код, он не отображает график, и когда я проверяю его, он выдает следующую ошибку : Failed to load resource:allpredicted.js:1 server answered with the server answered with a status of 404 (Not Found). Может ли кто-нибудь сказать, в чем может быть проблема? Я пробовал менять расположение папок static и template, но ничего не помогло.
Это файл javascript, который создает график
allpredicted.js
/*
* Parse the data and create a graph with the data.
*/
function parseData(createGraph) {
Papa.parse("201222-yarn-market-price-china--034.csv1.csv", {
download: true,
complete: function(results) {
createGraph(results.data);
}
});
}
function createGraph(data) {
var years = ['x'];
var pred_appended = ["Cotton Yarn1"];
for (var i = 1; i < data.length; i++) {
if (data[i][0] === undefined) {
years.push (null);
} else {
years.push (data[i][0]);
}
if (data[i][2] === undefined) {
pred_appended.push (null);
} else {
pred_appended.push (data[i][2]);
}
}
console.log(years);
console.log(pred_appended);
var chart = c3.generate({
data: {
x: 'x',
//xFormat: '%d/%m/%Y', // 'xFormat' can be used as custom format of 'x'
columns: [
years,
// ['x', '20130101', '20130102', '20130103', '20130104', '20130105', '20130106'],
pred_appended
]
},
axis: {
x: {
type: 'timeseries',
tick: {
format: '%d/%m/%Y' },
label: {
text: 'Date',
position: 'outer-center'
}
},
y: {
label: {
text: 'Price',
position: 'outer-middle'
// inner-top : default
// inner-middle
// inner-bottom
// outer-top
// outer-middle
// outer-bottom
}
}
},
grid: {
x: {
show: true
},
y: {
show: true
}
},
subchart: {
show: true
},
zoom: {
enabled: true
},
point: {
show: false
}
});
}
parseData(createGraph);
Это html-файл: home.html
><div class="main ">
<!doctype html>
<html lang="en">
<body>
{% load static %}
<link rel='stylesheet' href="https://cdnjs.cloudflare.com/ajax/libs/c3/0.7.20/c3.css" />
<!-- Load c3.css -->
<link rel="stylesheet" href="{% static 'nfyp/stylesheets/c3.css' %}" type="text/css">
<!-- Load d3.js and c3.js -->
<script src="https://d3js.org/d3.v7.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/c3/0.7.20/c3.min.js"></script>
<!-- Load papaparse.js -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/PapaParse/5.3.2/papaparse.min.js"></script>
<style>
h3 {
background-color: white;
color: #6eeb34;
text-align: center;
padding-bottom: 35px;
}
</style>
<div><h3 class="h1-responsive font-weight-bold text-center my-4">Stock Forecast</h3></div>
<div id="container">
<div id="chart"></div>
</div>
{% load static %}
<script src="{% static 'javascripts/allpredicted.js' %}"></script>
<body>
</div>
{% endblock %}
