如何过滤dxChart的数据

时间:2013-12-25 12:08:56

标签: c# javascript asp.net devexpress chart.js

我使用了ChartJS DevExpress。它从我的Web服务(ODataContext)获取并显示数据

我可以获取所有数据,但我想通过页面上的lblDeviceID值进行过滤!

DealerPage.aspx.cs:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using DevExpress.Web.ASPxEditors;

public partial class _DealerPage : System.Web.UI.Page

{
private string m_DeviceID = "";

protected void Page_Load(object sender, EventArgs e)
{
    this.m_DeviceID = this.Page.Request.QueryString["DI"].ToString();
    lblDeviceID.Text = this.m_DeviceID.ToString();

}

}

DealerPage.aspx:

  <%@ Page Language="C#" MasterPageFile="~/Main.master"  AutoEventWireup="true"   
   CodeFile="DealerPage.aspx.cs" Inherits="_DealerPage" %>

 <asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server">


<script type="text/javascript" src="js/jquery-2.0.3.min.js"></script>
<script type="text/javascript" src="js/globalize.min.js"></script>
<script type="text/javascript" src="js/dx.all.js"></script>
<script type="text/javascript">

    var db = new DevExpress.data.ODataContext  ( 
   {

  url: 'http://someservices.com/DataService.svc/',
  entities: {
  sonolcum3: {
  key: ["a_TankLevel1", "a_TankLevel2", "DeviceID"],
  keyType: {
  a_TankLevel1: "Int32",
  a_TankLevel2: "Int32",
  DeviceID: "Int32"


  }
  }
  }
  }  );

var chartSeries = [{ argumentField: 'readTime', valueField: 'a_TankLevel1' }, 
{ argumentField: 'readTime', valueField: 'a_TankLevel2' }];

 $(function () {

 $('#chartContainer').dxChart({
 dataSource: db.sonolcum3,
 series:chartSeries

  });

  $('#rangeContainer').dxRangeSelector({
  dataSource: db.sonolcum3,
  chart: {
   series: chartSeries

   },

   selectedRangeChanged: function (e) {

   var zoomedChart = $("#chartContainer").dxChart("instance");

   zoomedChart.zoomArgument(e.startValue, e.endValue);

   }

   } );
   } );

</script>


<body>
 <div>
 <div id="chartContainer"></div>

 <div id="rangeContainer"></div>

</div>

 <dx:ASPxLabel ID="lblDeviceID" runat="server" Text="">

 </dx:ASPxLabel>

</body>
</asp:Content>

结果:http://snag.gy/E8eVQ.jpg

我可以显示db.sonolcum3的所有数据,但我想按lblDeviceID(DeviceID key)值进行过滤。

lblDeviceID文本等于Page.Request.QueryString [“DI”]

E.g

当打开localhost / DealerPage.aspx?DI = 123456

过滤并显示DeviceID = 123456

的数据

1 个答案:

答案 0 :(得分:0)

您可以使用以下方法:

dataSource: { 
  store: db.sonolcum3,
  filter: ["DeviceID", "=", 123456]
}

ChartJS库使用与PhoneJS相同的数据层。

链接: