[CLOSED] Customized label for Stacked Chart

  1. #1

    [CLOSED] Customized label for Stacked Chart

    Hi,

    We are trying to build a Stacked chart with customized label. We want to display label on each data column of the Stacked chart. How can we specify multiple data fields in a chart label.

    Please find the attached imageClick image for larger version. 

Name:	Current.png 
Views:	38 
Size:	14.4 KB 
ID:	6321Click image for larger version. 

Name:	Required.png 
Views:	26 
Size:	14.7 KB 
ID:	6322
    Last edited by Daniil; Jun 27, 2013 at 7:49 AM. Reason: [CLOSED]
  2. #2
    Hi @WHISHWORKS,

    I guess you should set up a Label's Field the same as a BarSeries' YField.

    For example,
    https://examples2.ext.net/#/Chart/Bar/Stacked/

    If set up this Label:
    <Label Field="Comedy,Action,Drama,Thriller" Display="InsideEnd" />
    it appears to be working as you need.
  3. #3
    Hello Daniil,

    Thank you for your reply.

    I have already tried this example but no luck. I am attaching the sample code please look into this and let me know if any correction required.

    <%@ Page Language="C#" %>
    
    <%@ Register assembly="Ext.Net" namespace="Ext.Net" tagprefix="ext" %>
    
    <script runat="server">
        public List<object> Data
        {
            get
            {
                return new List<object> 
                { 
                    new {Year = 2005, Comedy = 34000000, Action = 23890000, Drama = 18450000, Thriller = 20060000},
                    new {Year = 2006, Comedy = 56703000, Action = 38900000, Drama = 12650000, Thriller = 21000000},
                    new {Year = 2007, Comedy = 42100000, Action = 50410000, Drama = 25780000, Thriller = 23040000},
                    new {Year = 2008, Comedy = 38910000, Action = 56070000, Drama = 24810000, Thriller = 26940000}
                };
            }
        }
    </script>
    
    <!DOCTYPE html>
    
    <html>
    <head id="Head1" runat="server">
        <title>Stacked Bar Chart - Ext.NET Examples</title>
        <link href="/resources/css/examples.css" rel="stylesheet" />
    </head>
    <body>
        <form id="Form1" runat="server">
            <ext:ResourceManager ID="ResourceManager1" runat="server" />
    
            <h1>Stacked Bar Chart Sample</h1>
    
            <p>Showing movie taking by genre as a stacked bar chart sample. Filter the stacks by clicking on the legend items.</p>
    
            <ext:Panel ID="Panel1" 
                runat="server"
                Width="800"
                Height="400"
                Title="Stacked Bar Chart - Movies by Genre"
                Layout="FitLayout">
                <Items>
                    <ext:Chart 
                        ID="Chart1" 
                        runat="server"
                        Shadow="true"
                        Animate="true">
                        <Store>
                            <ext:Store ID="Store1" 
                                runat="server" 
                                Data="<%# Data %>" 
                                AutoDataBind="true">                           
                                <Model>
                                    <ext:Model ID="Model1" runat="server">
                                        <Fields>
                                            <ext:ModelField Name="Year" />
                                            <ext:ModelField Name="Comedy" />
                                            <ext:ModelField Name="Action" />
                                            <ext:ModelField Name="Drama" />
                                            <ext:ModelField Name="Thriller" />
                                        </Fields>
                                    </ext:Model>
                                </Model>
                            </ext:Store>
                        </Store>
    
                        <LegendConfig Position="Right" />
    
                        <Axes>
                            <ext:NumericAxis                             
                                Fields="Comedy,Action,Drama,Thriller"
                                Position="Bottom"
                                Grid="true">
                                <Label>
                                    <Renderer Handler="return String(value).replace(/000000$/, 'M');" />
                                </Label>
                            </ext:NumericAxis>                            
    
                            <ext:CategoryAxis Fields="Year" Position="Left" />                            
                        </Axes>
    
                        <Series>
                            <ext:BarSeries 
                                Axis="Bottom"
                                Gutter="80"
                                XField="Year" 
                                YField="Comedy,Action,Drama,Thriller"
                                Stacked="true">
                                <Tips TrackMouse="true" Width="65" Height="28">
                                    <Renderer Handler="this.setTitle(String(item.value[1] / 1000000) + 'M');" />
                                </Tips>
                                <Label Field="Comedy,Action,Drama,Thriller" Display="InsideEnd"></Label>
                            </ext:BarSeries>
                        </Series>
                    </ext:Chart>
                </Items>
            </ext:Panel>
        </form>    
    </body>
    </html>

    Quote Originally Posted by Daniil View Post
    Hi @WHISHWORKS,

    I guess you should set up a Label's Field the same as a BarSeries' YField.

    For example,
    https://examples2.ext.net/#/Chart/Bar/Stacked/

    If set up this Label:
    <Label Field="Comedy,Action,Drama,Thriller" Display="InsideEnd" />
    it appears to be working as you need.
  4. #4
    The example produces the following for me.
    Click image for larger version. 

Name:	Stacked bar labels.JPG 
Views:	39 
Size:	59.5 KB 
ID:	6338

    What does it produce for you? What Ext.NET version are you using?
  5. #5
    Hello Daniil,

    Thank you for your response. I was using old dll and it is not rendering on that chart. Now I am able to view the output as expected with new dlls. One more issue I was trying to update existing reference of ext.net dll to latest version of dll and required changes on web.config side are done. Still I am getting error on the application. Please find the attached error message as image and my web.config content is


    <?xml version="1.0"?>
    <configuration>
      <configSections>
        <section name="extnet" type="Ext.Net.GlobalConfig" requirePermission="false" />
      </configSections>
    
      <extnet theme="Gray" />
      
      <system.web>
        <httpHandlers>
          <add path="*/ext.axd" verb="*" type="Ext.Net.ResourceHandler" validate="false" />
        </httpHandlers>
    
        <httpModules>
          <add name="DirectRequestModule" type="Ext.Net.DirectRequestModule, Ext.Net" />
        </httpModules>
    
        <pages>
          <controls>
            <add assembly="Ext.Net" namespace="Ext.Net" tagPrefix="ext" />
          </controls>
        </pages>
      </system.web>
    
      <system.webServer>
        <validation validateIntegratedModeConfiguration="false" />
            
        <modules>
          <add name="DirectRequestModule" preCondition="managedHandler" type="Ext.Net.DirectRequestModule, Ext.Net" />
        </modules>
            
        <handlers>
          <add name="DirectRequestHandler" verb="*" path="*/ext.axd" preCondition="integratedMode" type="Ext.Net.ResourceHandler" />
        </handlers>
      </system.webServer>
      
      <runtime>
        <assemblyBinding xmlns="urn:schemas-microsoft-com:asm.v1">
          <dependentAssembly>
            <assemblyIdentity name="Newtonsoft.Json" publicKeyToken="30ad4fe6b2a6aeed" />
            <bindingRedirect oldVersion="1.0.0.0-4.5.10" newVersion="4.5.11" />
          </dependentAssembly>
          <dependentAssembly>
            <assemblyIdentity name="Ext.Net.Utilities" publicKeyToken="2c34ac34702a3c23" />
            <bindingRedirect oldVersion="0.0.0.0-2.2.0" newVersion="2.2.1" />
          </dependentAssembly>
          <dependentAssembly>
            <assemblyIdentity name="Transformer.NET" publicKeyToken="e274d618e7c603a7" />
            <bindingRedirect oldVersion="0.0.0.0-2.1.0" newVersion="2.1.1" />
          </dependentAssembly>
        </assemblyBinding>
      </runtime>
    </configuration>

    Quote Originally Posted by Daniil View Post
    The example produces the following for me.
    Click image for larger version. 

Name:	Stacked bar labels.JPG 
Views:	39 
Size:	59.5 KB 
ID:	6338

    What does it produce for you? What Ext.NET version are you using?
    Attached Thumbnails Click image for larger version. 

Name:	Ext2.2_Upgrading_Error.png 
Views:	14 
Size:	45.3 KB 
ID:	6438  
    Last edited by Daniil; Jun 24, 2013 at 12:44 PM. Reason: Please use [CODE] tags
  6. #6
    Please try "Clean solution" in Visual Studio and rebuild.

Similar Threads

  1. Replies: 5
    Last Post: Mar 11, 2014, 3:03 PM
  2. Replies: 4
    Last Post: Mar 13, 2013, 6:10 AM
  3. [CLOSED] Stacked Chart, How to get clicked YField
    By gs_user in forum 2.x Legacy Premium Help
    Replies: 2
    Last Post: Jan 28, 2013, 6:04 AM
  4. [CLOSED] when i use Chart Stacked Sample.....it is Blank! ?
    By gs_user in forum 2.x Legacy Premium Help
    Replies: 2
    Last Post: Jan 25, 2013, 9:12 AM
  5. [CLOSED] Perhaps a bug in stacked column chart
    By feanor91 in forum 2.x Legacy Premium Help
    Replies: 11
    Last Post: Jul 23, 2012, 8:19 AM

Posting Permissions