如何在 django 中使用 ajax 更新 d3 图表中的变量答案

【问题标题】：How to update variable in d3 chart using ajax in django如何在 django 中使用 ajax 更新 d3 图表中的变量
【发布时间】：2020-09-25 21:47:05
【问题描述】：

我将更新 d3 图表脚本中的数据变量，而不使用从 view.py 发送的变量 ajax 刷新屏幕。怎么更新呢，d3图表中的变量是{{totalSalesGraph|safe}}

htmlFile.html

<html>
    <div class="graphTotalSale">
        <div id="graphSale"></div>
    </div>
    <script>
        setInterval(function() {
            $.ajax({
                type: "GET",
                url: "{% url 'updateData' %}"
            })
            .done(function(response) {
                  // how to update {{totalSalesGraph}} variable in d3 chart. (new value is response.totalSalesGraph)
            });
        }, 5000)
    </script>
    <script>
        var margin = {top: 10, right: 30, bottom: 30, left: 60},
            width = 550
            height = 120

        var svg = d3.select("#graphSale")
        ...

        //Read the data
        var data = {{totalSalesGraph|safe}}
        ...
    </script>
<html>

【问题讨论】：

标签： javascript html django ajax d3.js

【解决方案1】：

看看 javascript proxies。您可以使用它们来重载 totalSalesGraph 的更新以实际重新渲染 d3 svg。这里还有一个in-depth explanation of proxies.

【讨论】：