python-Web-django- chart statistics

Download highchart plug-in package, on the static case

 

<script src="/static/highcharts/highcharts.js"></script>
<script src="/static/highcharts/highcharts-zh_CN.js"></script>

 

 

Built route

# 图表
re_path('click/click/',click.click,name='click/click/')

Construction method:

from django.shortcuts import render
from app01.models import *
from back.views.ddff import defense_url

@defense_url
def click(request):
    '''点击量和点赞量图表'''
    recent_seven_day = recent_seven_days()
    list_week_day = recent_seven_day[::-1]

    clicknum_list = []
    praise_num_list = []
    for v in list_week_day:
        res1 = Praise.objects.filter(addtime__icontains = v,praise_type=0).count()
        res2 = Praise.objects.filter(addtime__icontains = v,praise_type=1).count()
        clicknum = res1
        praise_num = res2
        clicknum_list.append(clicknum)
        praise_num_list.append(praise_num)

    return render(request,'click/click.html',locals())


import datetime
def recent_seven_days():
    '''获取7天日期'''
    d = datetime.datetime.now()
    list1 = []
    for i in range(1,8):
        oneday = datetime.timedelta(days=i)
        day = d - oneday
        date_to = datetime.datetime(day.year,day.month,day.day)
        list1.append(str(date_to)[0:10])
    return list1

Ken Html :

 

< Script > 
        var Chart = Highcharts.chart ( ' Container ' , { 
    Chart: { 
        type: ' Line ' 
    }, 
    title: { 
        text: ' daily traffic statistics and thumbs ' 
    }, 
    SUBTITLE: { 
        text: ' Source : yunhe.cn ' 
    }, 
    XAXIS: { 
        the Categories: {{list_week_day | Safe}} 
    }, 
    YAXIS: { 
        title: { 
            text: ' traffic (the click) '
        } 
    }, 
    PlotOptions: { 
        Line: { 
            dataLabels: { 
                // Open the data tag 
                Enabled: to true 
            }, 
            // turn off mouse tracking, the corresponding prompt box, the click event expires 
            enableMouseTracking: to false 
        } 
    }, 
    Series: [{ 
        name: ' clicks ' , 
        Data: {{clicknum_list | Safe}} 
    }, { 
        name: ' thumbs amount ' , 
        Data: {{praise_num_list | Safe}} 
    }] 
}); 

        </script>

 

 

Copy highchart in the html code and js code into their own pages

Change js path

Get nearly 7 date: