Syncfusion Chart数据绑定

时间:2017-01-11 07:35:16

标签: asp.net charts syncfusion

如何使用 Syncfusion 将数据源绑定到visual studio 2015中的图表控件?有人可以为它提供asp.net代码吗?

这是我试过的代码

 <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="ChartDemo.WebForm1" %>

<%@ Register assembly="Syncfusion.EJ.Web" namespace="Syncfusion.JavaScript.Web" tagprefix="ej" %>
<%@ Register assembly="Syncfusion.EJ" namespace="Syncfusion.JavaScript.DataVisualization.Models" tagprefix="ej" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script src="Scripts/ej/datavisualization/ej.chart.min.js"></script>
    <script src="http://cdn.syncfusion.com/js/assets/external/jquery-1.10.2.min.js"></script>

    <!-- Essential JS UI widget -->
    <script src="http://cdn.syncfusion.com/13.1.0.21/js/web/ej.web.all.min.js"></script>

    <!--Add Syncfusion Script Manager -->
    <script>


    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>

        <ej:Chart ID="Chart1" runat="server" DataSourceID="SqlDataSource1" SeriesType="Column" XName="NetCurrentAssets" YName="NetDeferredTax">
<CommonSeriesOptions Type="Column" XName="NetCurrentAssets" YName="NetDeferredTax">
<CornerRadius Top="0" Bottom="0" Left="0" Right="0"></CornerRadius>

<Marker>
<DataLabel MaximumLabelWidth="0">
<Offset X="0" Y="0"></Offset>
</DataLabel>
</Marker>
</CommonSeriesOptions>

<Crosshair>
<Marker>
<DataLabel MaximumLabelWidth="0">
<Offset X="0" Y="0"></Offset>
</DataLabel>
</Marker>

<TrackballTooltipSettings>
<Border Color=""></Border>
</TrackballTooltipSettings>
</Crosshair>

<PrimaryXAxis DesiredIntervals="" MaximumLabelWidth="34" LabelIntersectAction="None">
<Title Offset="0"></Title>
</PrimaryXAxis>

<PrimaryYAxis DesiredIntervals="" MaximumLabelWidth="34" LabelIntersectAction="None">
<Title Offset="0"></Title>
</PrimaryYAxis>

<Title Offset="0"></Title>

<Legend Background="" Fill="">
<Size Width="" Height=""></Size>
</Legend>

<Zooming ToolbarItems="(Collection)"></Zooming>

<ExportSettings Angle="0"></ExportSettings>
        </ej:Chart>
        <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:newreporttoolConnectionString %>" SelectCommand="SELECT top 10 [NetCurrentAssets], [NetDeferredTax] FROM [Bsratios]"></asp:SqlDataSource>

    </div>
    </form>
</body>
</html>

这是错误的        &#39; /&#39;中的服务器错误应用

Parser Error

Description: An error occurred during the parsing of a resource required to service this request. Please review the following specific parse error details and modify your source file appropriately. 

Parser Error Message: Type 'System.Object' does not have a public property named 'Top'.

Source Error: 


Line 27:         <ej:Chart ID="Chart1" runat="server" DataSourceID="SqlDataSource1" SeriesType="Column" XName="NetCurrentAssets" YName="NetDeferredTax">
Line 28: <CommonSeriesOptions Type="Column" XName="NetCurrentAssets" YName="NetDeferredTax">
Line 29: <CornerRadius Top="0" Bottom="0" Left="0" Right="0"></CornerRadius>
Line 30: 
Line 31: <Marker>

Source File: /WebForm1.aspx    Line: 29 

Version Information: Microsoft .NET Framework Version:4.0.30319; ASP.NET Version:4.6.1586.0

1 个答案:

答案 0 :(得分:0)

我们通过在后面的代码中给出点并将dataSource绑定到图表来创建示例。将数据源绑定到图表后,在系列中,您必须分别使用xName和yName属性将x和y值映射到相应的字段。请在下面找到代码段,

//Assigning points in code behind 
List<ChartData> data = new List<ChartData>(); 
data.Add(new ChartData(2005, 28)); 
data.Add(new ChartData(2006, 25)); 
data.Add(new ChartData(2007, 26)); 
data.Add(new ChartData(2008, 27)); 
data.Add(new ChartData(2009, 32)); 
data.Add(new ChartData(2010, 35)); 
data.Add(new ChartData(2011, 30)); 
//Binding Datasource to Chart 
this.Chart.DataSource = data; 
this.Chart.DataBind(); 

//Mapping x and y values in series 
<Series> 
    <ej:Series XName="Xvalue" YName="YValue1">                         
    </ej:Series> 
</Series> 

供您参考,我们已附上样本。请从下面的链接中找到样本。 Sample

由于数据可以以不同的方式绑定,例如JSON,SQL,XML等图表。因此,我们想知道您需要为图表绑定哪种类型的数据。

以下是数据绑定到图表的在线示例链接。

SQL Data

Remote Data

有关数据绑定的更多详细信息,请点击以下链接。 Help document

谢谢, 陀罗尼。