ChartJS 在图表中按数据显示SQL Server分组

s4n0splo  于 2023-10-18  发布在  Chart.js
关注(0)|答案(1)|浏览(196)

我在做一个图表项目。它可以是Chartjs.org或谷歌图表。
我可以从SQL Server中检索数据并在网格视图中显示它。我的问题是,我如何直接在条形图中显示这些数据。从SQL Server检索的数据按条件分组。如果可以使用API,请给予我一些代码。

qeeaahzv

qeeaahzv1#

使用DataTable将下面的代码添加到c#中,并将其分配给

  1. <div class="card-body">
  2. <asp:Literal ID="ltScripts" runat="server"></asp:Literal>
  3. <div id="piechart_3d" style="width: 465px; height: 400px;">
  4. </div>

C#代码:

  1. DataTable dsChartData = new DataTable();
  2. StringBuilder strScript = new StringBuilder();
  3. try
  4. {
  5. dsChartData = GetChartData();
  6. strScript.Append(@"<script type='text/javascript'>
  7. google.load('visualization', '1', {packages: ['corechart']}); </script>
  8. <script type='text/javascript'>
  9. function drawChart() {
  10. var data = google.visualization.arrayToDataTable([
  11. ['Priority', 'Total'],");
  12. foreach (DataRow row in dsChartData.Rows)
  13. {
  14. strScript.Append("['" + row["Priority"] + "'," + row["Total"] + "],");
  15. }
  16. strScript.Remove(strScript.Length - 1, 1);
  17. strScript.Append("]);");
  18. strScript.Append(@" var options = {
  19. is3D: true,
  20. }; ");
  21. strScript.Append(@"var chart = new google.visualization.PieChart(document.getElementById('piechart_3d'));
  22. chart.draw(data, options);
  23. }
  24. google.setOnLoadCallback(drawChart);
  25. ");
  26. strScript.Append(" </script>");
  27. ltScripts.Text = strScript.ToString();
  28. }
  29. catch
  30. {
  31. }
  32. finally
  33. {
  34. dsChartData.Dispose();
  35. strScript.Clear();
  36. }
展开查看全部

相关问题