0

每次用户从一些下拉菜单中选择值并提交它们时，我都需要更新图表。

我正在编写 Python 脚本来处理选定的选项并根据用户的选择从数据库中获取数据，然后使用字符串替换技术将数据传递给 HTML。javascript 从 Python 中获取数据，并使用谷歌图表 API 生成图表。

但这仅适用于一次。第一次后，用户选择并提交选择，图表保持不变。我可以使用 firebug 工具看到数据是正确的。

有人可以帮我吗？谢谢！

下面是我的javascripts：

script src="http://www.google.com/jsapi?key=ABQIAAAA1Vvq5pLyw5IAAQQtCIurLhSCGfxgLuOmAJcC-OBbFOMYrpib_BSypK7Qf_9YkaT-2SzpuOBRKp6Bqw" type="text/javascript"></script>
    <script type="text/javascript">
      google.load("jquery", "1.3.2");
    </script>

      <!--Load the AJAX API-->
        <script type="text/javascript" src="http://www.google.com/jsapi"></script>
        <script type="text/javascript">
            google.load('visualization', '1', {packages: ['corechart']});
        </script>
        <script type="text/javascript">
            google.setOnLoadCallback(drawVisualization);
            function drawVisualization() {
                        var data = new google.visualization.DataTable();
                        {%if chart_Data%}
                            data.addColumn('string','Date Time');
                            data.addColumn('number','Wireless Mini CCB Controls');
                            data.addColumn('number','FNX App Controls');
                            data.addColumn('number','Hoist Status');
                            data.addRows({{chart_Data}});

                            //var data = google.visualization.arrayToDataTable({{chart_Data}});

                        var options = {
                                title: 'Status of Hoists',
                                vAxis: {title: 'Status of Hoists'},
                                isStacked: true
                        };

                            var chart = new google.visualization.SteppedAreaChart(document.getElementById('status_chart'));
                            chart.draw(data, options);
                        {% endif %}
  }

下面是我处理下拉列表菜单选择并将“GET”请求发送到我的 Python 处理程序的函数，它将返回一个替换字符串 {{chart_Data}}：

function monitorHoist(hoist_to_monitor,month,day,year){

            var hoist_to_monitor_text = document.getElementById('hoist_to_monitor').options[document.getElementById('hoist_to_monitor').selectedIndex].value
            var month_text = document.getElementById('month').options[document.getElementById('month').selectedIndex].value
            var day_text = document.getElementById('day').options[document.getElementById('day').selectedIndex].value
            var year_text = document.getElementById('year').options[document.getElementById('year').selectedIndex].value
            $.ajax({
            type: 'GET',  
            url: '/all?command=monitor&hoist_to_monitor=' + hoist_to_monitor_text +'&month='+month_text+'&day='+day_text+'&year='+year_text,
            //data: hoist_to_monitor_text,month_text,day_text,year_text,
            timeout: 60000,
            success: function(data) {
              $("#status").html('Success in sending request.');
              //drawVisualization();
            },
            error: function(XMLHttpRequest, textStatus, errorThrown) {
              $("#status").html('Timeout sending request.');
            }
        });
      }

下面是图表的划分：

<div id='status_chart' style="width: 900px; height: 500px;"></div>
4

1 回答 1

0

问题是您没有解析字段的reqId值tqx（请参阅实现 ChartTools 数据源协议）。

如果您使用gviz_api（https://code.google.com/p/google-visualization-python/），那么您必须将值传递req_id给方法ToJsonResponse。

于 2013-02-03T19:39:40.067 回答