This example demonstrates how to obtain the chart datasource using the IDataSource interface implemented by the ASPxPivotGrid, convert data to the JSON format and pass it to the client via a custom JS property added to the ASPxPivotGrid.
Example Comments
Added By: at: 2/14/2013 8:16:06 AM
I tried the below example and I am getting the following exception. I was able to successfully build the project though..
Server Error in '/' Application.
--------------------------------------------------------------------------------
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: Could not load file or assembly 'DevExpress.Web.ASPxPivotGrid.v12.2, Version=12.2.0.0, Culture=neutral, PublicKeyToken=79868b8147b5eae4' or one of its dependencies. The system cannot find the file specified.
Source Error:
Line 1: <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="DxSample.Default" %>
Line 2:
Line 3: <%@ Register Assembly="DevExpress.Web.ASPxPivotGrid.v12.2, Version=12.2.0.0, Culture=neutral, PublicKeyToken=79868b8147b5eae4" Namespace="DevExpress.Web.ASPxPivotGrid" TagPrefix="dxpg" %>
Line 4:
Line 5: <!DOCTYPE html>
Source File: /default.aspx Line: 3
Assembly Load Trace: The following information can be helpful to determine why the assembly 'DevExpress.Web.ASPxPivotGrid.v12.2, Version=12.2.0.0, Culture=neutral, PublicKeyToken=79868b8147b5eae4' could not be loaded.
=== Pre-bind state information ===
LOG: User = JAMOCHAHQ\sathish.rao
LOG: DisplayName = DevExpress.Web.ASPxPivotGrid.v12.2, Version=12.2.0.0, Culture=neutral, PublicKeyToken=79868b8147b5eae4
(Fully-specified)
LOG: Appbase = file:///D:/workspace/BAP/BAP Application/BAPTestpages/
LOG: Initial PrivatePath = D:\workspace\BAP\BAP Application\BAPTestpages\bin
Calling assembly : (Unknown).
===
LOG: This bind starts in default load context.
LOG: Using application configuration file: D:\workspace\BAP\BAP Application\BAPTestpages\web.config
LOG: Using host configuration file:
LOG: Using machine configuration file from C:\Windows\Microsoft.NET\Framework\v4.0.30319\config\machine.config.
LOG: Post-policy reference: DevExpress.Web.ASPxPivotGrid.v12.2, Version=12.2.0.0, Culture=neutral, PublicKeyToken=79868b8147b5eae4
LOG: The same bind was seen before, and was failed with hr = 0x80070002.
--------------------------------------------------------------------------------
Version Information: Microsoft .NET Framework Version:4.0.30319; ASP.NET Version:4.0.30319.272
I added the jquery ui resize and drag properties to the div around the charting component. However when the div is resized, the svg chart is not resized, it stays orphaned from the parent div control.
How do I set 'id' to the SVG or set the width and height of the SVG to be 100% so that when I resize the parent div control, even the svg is resized accordingly.
Below is my aspx code.
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="DxSample.Default" %>
<%@ Register Assembly="DevExpress.Web.ASPxPivotGrid.v12.2, Version=12.2.5.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a"
Namespace="DevExpress.Web.ASPxPivotGrid" TagPrefix="dxpg" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title></title>
http://www.devexpress.com/Support/Center/css/dxtreme.desktop.default-12.2.css
http://www.devexpress.com/Support/Center/css/site.css
http://www.devexpress.com/Support/Center/css/jquery-ui-1.10.1.custom.min.css
<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="js/knockout-2.1.0.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.10.1.custom.min.js"></script>
<script type="text/javascript" src="js/globalize.js"></script>
<script type="text/javascript" src="js/dxtreme.core-12.2.js"></script>
<script type="text/javascript" src="js/dxtreme.framework-12.2.js"></script>
<script type="text/javascript" src="js/dxtreme.viz-12.2.js"></script>
<script type="text/javascript" src="js/index.js"></script>
<script>
$(function () {
$("#charts").resizable();
});
$(function () {
$("#charts").draggable();
});
</script>
</head>
<body style="vertical-align: middle">
<form id="form1" runat="server">
<div style="width: 600px; margin: 0 auto;">
<br />
<dxpg:ASPxPivotGrid Width="600px" runat="server" DataSourceID="salesPersonSource"
ID="pivotGrid" ClientInstanceName="pivotGrid">
<Fields>
<dxpg:PivotGridField FieldName="CategoryName" Area="RowArea" />
<dxpg:PivotGridField FieldName="ProductName" Area="FilterArea" />
<dxpg:PivotGridField FieldName="Country" Area="ColumnArea" />
<dxpg:PivotGridField FieldName="Sales Person" Area="FilterArea" />
<dxpg:PivotGridField FieldName="Extended Price" Area="DataArea" />
</Fields>
<ClientSideEvents EndCallback="function(s, e) { window.DxSample.updateChartData(pivotGrid.cpChartData);}" />
</dxpg:ASPxPivotGrid>
<br />
<asp:AccessDataSource runat="server" SelectCommand="select Country, ProductName, CategoryName, [Extended Price], [Sales Person] from SalesPerson"
ID="salesPersonSource" DataFile="~/app_data/nwind.mdb" />
<div id="charts" style="width:600px;height:400px;background-color: #eeeeff; float: right; border-style: solid; margin: 0px; padding:10px"
data-bind="dxChart: { commonSeriesSettings: { argumentField: 'argument' }, series: series, dataSource: dataSource, tooltip:{enabled:true}}" />
</div>
</form>
</body>
</html>
Hello Sathish,
I have created a Support Center ticket on your behalf to discuss this issue: DXTREME - The Chart is not automatically resized. Please bear with us, we will answer your question as soon as possible.
Added By: david karasek at: 5/8/2013 8:47:06 AMWas this ever resolved? Is there a complete example and guide of inter-operability between DxTreme and and Dxperience? In an AJAX context, what is the best practice for these to work well together?
Wouldn't change events in the grid need to be triggered via AJAX so as not to do a full page refresh?
In addition what is the best process for this working in MVC? The same as ASP web forms? Different?
Hello David,
I have create a new ticket on your behald to discuss your questions: Few question about interaction between DevExpress ASP.NET components and DXTREME Mobile widgets?. Please bear with us, we will ge back to you as soon as possible.