[CLOSED] Using common tip content for different series of a chart

  1. #1

    [CLOSED] Using common tip content for different series of a chart

    Hello,

    I have 'n' (Let's say 5) scatter series in a chart. I want to use a common marker 'tip' for each series. There exists a grid panel in the common tip content which is filtered according to a specific storeItem property. Series are created in code behind. Since the tip content is common, i created it in markup and want to show the filtered grid panel which ever series point's tip is shown. Currently if I define the grid panel with exactly same properties but different ID and add it to series tip items collection (all in code behind) it works as expected. I do not want crreate copies of the tip content. How can I use a common tip content for each series? I would be happy to see a basic sample showing the way (if possible).

    Thanks.
    Last edited by Daniil; May 07, 2013 at 3:51 AM. Reason: [CLOSED]
  2. #2
    Trying...

    The common grid panel is in <Bin> collection of the chart. In the tip renderer function, I though I could render the grid panel into tip's body and tried something like below:

    grid.render(tip);
    And it did not work of course (; May be using an appropriate property of tip, it might be possible, the question is which property?

    grid.render(tip.??)
  3. #3
    Hi @bayoglu,

    I think you can use the add method.

    Example
    <%@ Page Language="C#" %>
     
    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
    
    <script runat="server">
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!X.IsAjaxRequest)
            {
                Store store = this.Chart1.GetStore();
                store.DataSource = new object[]
                {
                    new 
                    {
                        x = 0,
                        y1 = 0,
                        y2 = 100 
                    },
                    new 
                    {
                        x = 50,
                        y1 = 50,
                        y2 = 75
                    },
                    new 
                    {
                        x = 100,
                        y1 = 100,
                        y2 = 0   
                    }
                };
    
                store = this.GridPanel1.GetStore();
                store.DataSource = new object[] 
                { 
                    new object[] { "test1", "test2" },
                    new object[] { "test3", "test4" }
                };
            }
        }
    </script>
    
    <!DOCTYPE html>
    <html>
    <head runat="server">
        <title>Ext.NET v2 Example</title>
    
        <script>
            var tipRenderer = function (storeItem, item) {
                var toolTip = this,
                    grid = item.series.chart.getBinComponent("GridPanel1");
    
                toolTip.add(grid);
            };
        </script>
    </head>
    <body>
        <form runat="server">
            <ext:ResourceManager runat="server" />
            <ext:Chart 
                ID="Chart1" 
                runat="server" 
                Width="400" 
                Height="400">
                <Bin>
                    <ext:GridPanel ID="GridPanel1" runat="server">
                        <Store>
                            <ext:Store runat="server">
                                <Model>
                                    <ext:Model runat="server">
                                        <Fields>
                                            <ext:ModelField Name="test1" />
                                            <ext:ModelField Name="test2" />
                                        </Fields>
                                    </ext:Model>
                                </Model>
                            </ext:Store>
                        </Store>
                        <ColumnModel runat="server">
                            <Columns>
                                <ext:Column runat="server" Text="Test1" DataIndex="test1" />
                                <ext:Column runat="server" Text="Test2" DataIndex="test2" />
                            </Columns>
                        </ColumnModel>
                    </ext:GridPanel>
                </Bin>
                <Store>
                    <ext:Store runat="server">
                        <Model>
                            <ext:Model runat="server">
                                <Fields>
                                    <ext:ModelField Name="x" />
                                    <ext:ModelField Name="y1" />
                                    <ext:ModelField Name="y2" />
                                </Fields>
                            </ext:Model>
                        </Model>
                    </ext:Store>
                </Store>
                <Axes>
                    <ext:NumericAxis Title="X" Fields="x" Position="Bottom" />
                    <ext:NumericAxis Title="Y" Fields="y1,y2" Position="Left" />
                </Axes>
                <Series>
                    <ext:LineSeries Titles="Chart 1" XField="x" YField="y1">
                        <Tips 
                            runat="server" 
                            Width="500" 
                            Height="200" 
                            Layout="FitLayout">
                            <Renderer Fn="tipRenderer" />
                        </Tips>
                    </ext:LineSeries>
                    <ext:LineSeries Titles="Chart 2" XField="x" YField="y2">
                        <Tips 
                            runat="server" 
                            Width="500" 
                            Height="200" 
                            Layout="FitLayout">
                            <Renderer Fn="tipRenderer" />
                        </Tips>
                    </ext:LineSeries>
                </Series>
            </ext:Chart>
        </form>
    </body>
    </html>

Similar Threads

  1. Replies: 13
    Last Post: Apr 26, 2016, 10:11 PM
  2. [CLOSED] [#8] Chart: Hide Line Series values
    By cwolcott in forum 2.x Legacy Premium Help
    Replies: 12
    Last Post: Mar 14, 2013, 5:41 AM
  3. [OPEN] [#77] Chart legend problems with large amount of series
    By MWM2Dev in forum 2.x Legacy Premium Help
    Replies: 14
    Last Post: Dec 21, 2012, 4:23 AM
  4. [CLOSED] chart series double click event
    By SymSure in forum 2.x Legacy Premium Help
    Replies: 4
    Last Post: Sep 04, 2012, 2:03 PM
  5. [CLOSED] Text on Series and Tool tips for Grouped Bar Chart
    By WHISHWORKS in forum 2.x Legacy Premium Help
    Replies: 3
    Last Post: Jul 16, 2012, 10:59 AM

Posting Permissions