Панель визуализации Google и ASP ASP

Question

Я пытаюсь создать диаграмму организации с помощью визуализации Google, которая обновляется с помощью вызовов AJAX с помощью панели обновления ASP.Однако вместо обновления диаграммы при обновлении AJAX диаграмма просто исчезает.У кого-нибудь есть идеи?Спасибо

<input type="button" id="cmdUpdate" onclick="__doPostBack('panel', '');" value="Update" />
<div id="divGChart" runat="server" style="width: 100%; overflow: auto;">
    <asp:UpdatePanel id="panel" runat="server" >
        <ContentTemplate>
            <div id="chart_div" runat="server" >
                <script type="text/javascript" src="https://www.google.com/jsapi"></script>

                <script type="text/javascript">
                    google.load('visualization', '1', { packages: ['orgchart'] });
                    google.setOnLoadCallback(drawChart);
                    function drawChart() {
                        var data = new google.visualization.DataTable();
                        data.addColumn('string', 'Name');
                        data.addColumn('string', 'Manager');
                        data.addColumn('string', 'ToolTip');
                        data.addRows([
                            [{ v: '10131', f: '10131'}, '', '10131'],
                            [{ v: '10132', f: '10132'}, '10131', '10132'],
                            [{ v: '10133', f: '10133'}, '10131', '10133'],
                            [{ v: '10134', f: '10134'}, '10131', '10134']
                        );
                        var chart = new google.visualization.OrgChart(document.getElementById('chart_div'));
                        chart.draw(data, {allowCollapse: true, allowHtml: true});
                    }    
                </script>
            </div>
        </ContentTemplate>
    </asp:UpdatePanel>
</div>

Answer 1

Не знаю, если у вас все еще есть проблема с этим, но это может быть полезно для других в будущем.

Это, видимо, известная ошибка, исправленная в версии 1.1 все, что вам нужно сделать, это изменить

google.load('visualization', '1', { packages: ['orgchart'] });

до

google.load('visualization', '1.1', { packages: ['orgchart'] });

Answer 2

Используйте pageLoad() для повторной инициализации скрипта, а также переместите ссылку на скрипт jsapi за пределы UpdatePanel, нет необходимости перезагружать его при каждой частичной обратной передаче:

 <script type="text/javascript">
    function pageLoad() //called on all partial postbacks
    {
        google.load('visualization', '1', { packages: ['orgchart'] });
        google.setOnLoadCallback(drawChart);
        function drawChart() {
        var data = new google.visualization.DataTable();
        data.addColumn('string', 'Name');
        data.addColumn('string', 'Manager');
        data.addColumn('string', 'ToolTip');
        data.addRows([
            [{ v: '10131', f: '10131'}, '', '10131'],
            [{ v: '10132', f: '10132'}, '10131', '10132'],
            [{ v: '10133', f: '10133'}, '10131', '10133'],
            [{ v: '10134', f: '10134'}, '10131', '10134']
        );
        var chart = new google.visualization.OrgChart(document.getElementById('chart_div'));
        chart.draw(data, {allowCollapse: true, allowHtml: true});
        }    
    }
</script>