You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
68 lines
2.3 KiB
68 lines
2.3 KiB
{% extends 'data_analysis/data_view_base.html' %}
|
|
|
|
{% block data_view %}
|
|
<div class="row">
|
|
<div class="col-12 justify-content-center d-flex">
|
|
<div id="comment_count" style="width:1000px; height:600px;"></div>
|
|
</div>
|
|
</div>
|
|
<hr>
|
|
<div class="row">
|
|
<div class="col-12 justify-content-center d-flex">
|
|
<div id="cate_articles_per" style="width:1000px; height:600px;"></div>
|
|
</div>
|
|
</div>
|
|
<hr>
|
|
<div class="row">
|
|
<div class="col-12 justify-content-center d-flex">
|
|
<div id="article_views_rank" style="width:1000px; height:600px;"></div>
|
|
</div>
|
|
</div>
|
|
|
|
{% endblock %}
|
|
{% block page_js %}
|
|
<script>
|
|
const comment_count = echarts.init(document.getElementById('comment_count'), 'black', {renderer: 'svg'});
|
|
const cate_articles_per = echarts.init(document.getElementById('cate_articles_per'), 'black', {renderer: 'svg'});
|
|
const article_views_rank = echarts.init(document.getElementById('article_views_rank'), 'black', {renderer: 'svg'});
|
|
$(
|
|
function () {
|
|
fetchCommentCount();
|
|
fetchCateArticlesPer();
|
|
fetchArticleViewsRank();
|
|
}
|
|
);
|
|
|
|
function fetchCommentCount() {
|
|
$.ajax({
|
|
type: "GET",
|
|
url: "http://127.0.0.1:8000/data_analysis/most_comment_article/",
|
|
dataType: 'json',
|
|
success: function (result) {
|
|
comment_count.setOption(result);
|
|
}
|
|
});
|
|
}
|
|
function fetchCateArticlesPer() {
|
|
$.ajax({
|
|
type: "GET",
|
|
url: "http://127.0.0.1:8000/data_analysis/cate_articles_per/",
|
|
dataType: 'json',
|
|
success: function (result) {
|
|
cate_articles_per.setOption(result);
|
|
}
|
|
});
|
|
}
|
|
function fetchArticleViewsRank() {
|
|
$.ajax({
|
|
type: "GET",
|
|
url: "http://127.0.0.1:8000/data_analysis/article_views_rank/",
|
|
dataType: 'json',
|
|
success: function (result) {
|
|
article_views_rank.setOption(result);
|
|
}
|
|
});
|
|
}
|
|
</script>
|
|
{% endblock %}
|