json - 如何为此 highchart 加载 JSON - django 应用程序

Question

我正在做 django 项目

我想做一个highchart依赖轮但我不知道为什么图表没有显示，你会在下面看到我的代码，在我的dependencywheel.html中我已经{%load static%}在顶部，

<script>
        Highcharts.chart('container', {

        title: {
        text: 'Highcharts Dependency Wheel'
        },

        accessibility: {
        point: {
            valueDescriptionFormat: '{index}. From {point.exped} to {point.destin}: {point.count}.'
        }
        },

        series: [{
        keys: ['exped', 'destin', 'count'],
        data: '{%url "data"%}',
        type: 'dependencywheel',
        name: 'Dependency wheel series',
        dataLabels: {
            color: '#333',
            textPath: {
            enabled: true,
            attributes: {
                dy: 5
            }
            },
            distance: 10
        },
        size: '95%'
        }]

        });

 </script>

这是我的意见.py

@login_required
def depend(request):
    return render(request,'dependWheel.html',{})

def jsonDepend(request):
     dataset = mail_item_countries_depend.objects.all().values_list('exped','destin','count')
     data = list(dataset)

     return JsonResponse(data, safe=False)

图表未显示，如何加载我的数据

标签： jsondjangohighcharts

Answer 1

这就是答案：

 <script type="text/javascript">
        $(function(){
            $.getJSON('data',function(data){
                Highcharts.chart('container', {

                title: {
                    text: 'Highcharts Dependency Wheel'
                },

                accessibility: {
                    point: {
                    valueDescriptionFormat: '{index}. From {point.from} to {point.to}: {point.weight}.'
                    }
                },

                series: [{
                    keys: ['from', 'to', 'weight'],
                    data:data,
                    type: 'dependencywheel',
                    name: 'Dependency wheel series',
                    dataLabels: {
                    color: '#333',
                    textPath: {
                        enabled: true,
                        attributes: {
                        dy: 5
                        }
                    },
                    distance: 10
                    },
                    size: '95%'
                }]

                });
            });
        });
    </script>