[Django]グラフを使用したグラフの実装

1.ハイグラフアドレスの入力
https://highcharts.com/

2. Demos > Highcharts JS Demos

すると次のような窓が現れます.

3.グラフ内のWith dataTableをクリック

4.EDIT IN JFIDDLEをクリック

次のような新しいウィンドウが開きます.

5.HTML 7行目
html 7行目の<div id="container"></div>をコピーしdjangoの部分に貼り付けます

6.HTML 1-4行
html 1-4行目のコードをコピーして家に帰ります.htmlに貼り付け

7.JavaScriptすべての行
JavaScript+No-Library(純JS)のすべてのコードをコピーし、<script></script>の間のfunction display()に貼り付けます.

function display(){
Highcharts.chart('container', {
    chart: {
        type: 'line'
    },
    title: {
        text: 'Monthly Average Temperature'
    },
    subtitle: {
        text: 'Source: WorldClimate.com'
    },
    xAxis: {
        categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
    },
    yAxis: {
        title: {
            text: 'Temperature (°C)'
        }
    },
    plotOptions: {
        line: {
            dataLabels: {
                enabled: true
            },
            enableMouseTracking: false
        }
    },
    series: [{
        name: 'Tokyo',
        data: [7.0, 6.9, 9.5, 14.5, 18.4, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6]
    }, {
        name: 'London',
        data: [3.9, 4.2, 5.7, 8.5, 11.9, 15.2, 17.0, 16.6, 14.2, 10.3, 6.6, 4.8]
    }]
});
}

function getdata(){
     display()
}