图表未使用 DotNet.HighCharts 和 WebForms 显示

本文关键字：WebForms 显示 HighCharts DotNet 未使用 | 更新日期: 2023-09-27 18:37:24

我正在遵循本教程，该教程讨论了使用 WebForms 将数据绑定到 sql 服务器。在添加数据绑定之前，我已经输入了原始数据以显示图表是否正常工作。但是，当我运行项目时，没有显示任何图表。我在VS2012中使用NuGet添加了DotNet.HighCharts。知道为什么没有呈现图表吗？这是我的默认代码.aspx.cs

namespace HighChartsWebForms
{
    public partial class _Default : Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            Render_Chart();
        }
        protected void Render_Chart()
        {
            Object[] chartValues = new Object[8]; // declare an object for the chart rendering
            DotNet.Highcharts.Highcharts chart = new DotNet.Highcharts.Highcharts("chart")
                .InitChart(new Chart { DefaultSeriesType = ChartTypes.Line })
                .SetTitle(new Title
                {
                    Text = "Data",
                    X = -20
                })
                .SetSubtitle(new Subtitle
                {
                    Text = "Source: Static data",
                    X = -20
                })
                .SetXAxis(new XAxis
                {
                    Categories = new[] { "Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug" }
                })
                .SetSeries(new[]
                {
                    new Series
                    {
                        Name = "# Pizza",
                        Data = new Data(new object[] { 2, 3, 5, 7, 6, 6, 7, 8 }),
                    },
                });
    ltChart1.Text = chart.ToHtmlString();
        }
    }
}

这是我的默认.aspx：

<%@ Page Title="Home Page" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="HighChartsWebForms._Default" %>
<asp:Content runat="server" ID="FeaturedContent" ContentPlaceHolderID="FeaturedContent">
    <section class="featured">
        <div class="content-wrapper">
            <hgroup class="title">
                <h1><%: Title %>.</h1>
                <h2>Testing HighCharts with ASP.NET</h2>
            </hgroup>
        </div>
    </section>
</asp:Content>
<asp:Content runat="server" ID="BodyContent" ContentPlaceHolderID="MainContent">
    <h3>This should show a chart:</h3>
    <asp:Literal id="ltChart1" runat="server"></asp:Literal>
</asp:Content>

图表未使用 DotNet.HighCharts 和 WebForms 显示

如果您使用 Site.Master 文件添加 JavaScript 文件的路径，请确保已添加这三个 JavaScript 文件的路径。

    <asp:ScriptManager runat="server">
        <Scripts>               
            <asp:ScriptReference Path="~/Scripts/highcharts.js" />
            <asp:ScriptReference Path="~/Scripts/jquery-1.5.1.min.js" />   
            <asp:ScriptReference Path="~/Scripts/exporting.js" />              
        </Scripts>
    </asp:ScriptManager>

查看本教程：http://dotnethighcharts.codeplex.com/这里对 MVC 和 Web 窗体进行了说明。

解决方案很简单。您忘记导入 highcharts.js 和 ajax 库。

    <asp:Content runat="server" ID="FeaturedContent" ContentPlaceHolderID="FeaturedContent">
    <section class="featured">
        <div class="content-wrapper">
            <hgroup class="title">
                <h1><%: Title %>.</h1>
                <h2>Testing HighCharts with ASP.NET</h2>
            </hgroup>
        </div>
    </section>
</asp:Content>
<asp:Content runat="server" ID="BodyContent" ContentPlaceHolderID="MainContent">
    <h3>This should show a chart:</h3>
  <!-- IMPORT THE JAVASCRIPT LIBRARIES HERE -->
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  <script type="text/javascript" src="http://code.highcharts.com/highcharts.js"></script>
  <script type="text/javascript" src="http://code.highcharts.com/modules/exporting.js"></script>
  <asp:Literal id="ltChart1" runat="server"></asp:Literal>
</asp:Content>
相关文章：