5.14. 异步加载图表

在看板模板内,除了通过为静态<div>元素设置dg-chart-widget属性定义图表外, 也可以使用看板对象loadChart 函数异步加载图表:

示例:

  1. <html>
  2. <head>
  3. <script type="text/javascript">
  4. $(document).ready(function()
  5. {
  6. $("#loadButton1").click(function()
  7. {
  8. dashboard.loadChart($("#chart1"), "[a chart widget id]");
  9. });
  10. $("#loadButton2").click(function()
  11. {
  12. var $chart2 = $("<div id="chart2"></div>").appendTo(document.body);
  13. dashboard.loadChart($chart2, "[a chart widget id]",
  14. function(chart)
  15. {
  16. alert("chart ["+chart.id+"] loaded");
  17. });
  18. });
  19. $("#removeButton2").click(function()
  20. {
  21. dashboard.removeChart("chart2");
  22. });
  23. });
  24. </script>
  25. </head>
  26. <body>
  27. <button id="loadButton1">加载图表1</button>
  28. <div id="chart1"></div>
  29. <button id="loadButton2">加载图表2</button>
  30. <button id="removeButton2">删除图表2</button>
  31. </body>
  32. </html>