Hybrid View

  1. #1
    Sencha - Ext JS Dev Team
    Join Date
    Jun 2011
    Location
    San Diego, CA
    Posts
    179
    Vote Rating
    35
    nohuhu has a spectacular aura about nohuhu has a spectacular aura about

      2  

    Lightbulb Ext.ux.chart.TitleChart - Chart with a Title

    Ext.ux.chart.TitleChart - Chart with a Title


    When one page contains several charts, it may be necessary to provide users with information on each charts' meaning. This is what Ext.ux.chart.TitleChart is for: it allows assigning title text to any kind of chart supported by Ext JS.

    It looks like this:

    TitleChart screenshot.png

    TitleChart accounts for presence or absence of a title, adjusting chart dimensions accordingly. Title can be placed at top, bottom, left or right side of the Chart. Padding between Chart edge and title text is configurable, as well as margin between title text and actual charting area.

    Usage is pretty straightforward, take a look at the source and it should be obvious how to use it. Demo application is provided as well.

    Tested with:
    • Chrome 15
    • Firefox 7
    • Safari 5
    • Opera 11
    • MSIE 8
    Source code is released under GPL 3.0 on Github: https://github.com/nohuhu/Ext.ux.chart.TitleChart. Commercial licensing is also available.

    Live demo: http://nohuhu.org/demos/demo_titlechart.html

    Sencha Market page: https://market.sencha.com/users/30/extensions/36

    Regards,
    Alex.
    Last edited by nohuhu; 14 Aug 2012 at 3:09 PM. Reason: Added demo link

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    36,604
    Vote Rating
    818
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    Could be a great submission for the App Gallery
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  3. #3
    Sencha User
    Join Date
    Dec 2009
    Posts
    37
    Vote Rating
    0
    feanor91 is on a distinguished road

      0  

    Default


    Hello

    I try to use your plugin but I get that message :

    uncaught exception: Ext.Loader is not enabled, so dependencies cannot be resolved dynamically. Missing required class: Ext.chart.TitleChart
    BTW, in my code (it's ASP.NET), I have :

    Code:
        <script type="text/javascript" src="jsFile/ext-all.js" />
      
        <script type="text/javascript">
            Ext.Loader.setConfig({
                enabled: true,
                disableCaching: true,
                paths: { 'Ext': "/app/" }
            });
        </script>
        
        <script src="jsFile/Chart.js" type="text/javascript"></script>
        <script src="jsFile/TitleChart.js" type="text/javascript"></script>
    ....
    I add that to my main include :

    Code:
    Ext.require('Ext.ux.chart.Chart');Ext.require('Ext.chart.TitleChart');
    Ext.require('Ext.ux.chart.TitleChart');
    I have already that :
    Code:
    Ext.require(['*']);
    but epic fail...


    I called the chart like that (not sure it will be good):

    Code:
    var ETTRChart= Ext.create('Ext.chart.TitleChart', {    animate: true,
        store: stoETTR,
        title: 'ETTR',
        titleFont: 'bold 16px sans-serif',
        titlePadding: 5,
        titleMargin: 5,
        insetPadding: 5,
        shadow: false,
    BTW, your example works well...Could you help me please?

  4. #4
    Sencha User
    Join Date
    Dec 2009
    Posts
    37
    Vote Rating
    0
    feanor91 is on a distinguished road

      0  

    Default


    Forget it, it works. I thought I was in 4.0.7, but apprently, i'm not, I try with 4.1.0 and it's good.


    Sorry to bother you.

  5. #5
    Sencha - Ext JS Dev Team
    Join Date
    Jun 2011
    Location
    San Diego, CA
    Posts
    179
    Vote Rating
    35
    nohuhu has a spectacular aura about nohuhu has a spectacular aura about

      1  

    Default


    Version 0.99 supports Ext JS 4.1.

  6. #6
    Touch Premium Member msinn's Avatar
    Join Date
    Jul 2009
    Location
    in front of my pc
    Posts
    280
    Vote Rating
    5
    msinn is on a distinguished road

      0  

    Default Does not work in IE8 or older

    Does not work in IE8 or older


    Hi @ nohuhu,

    your extension works great with 4.1.3 and the popular browsers, but it does not work with IE8 and older or in Quirksmodus, just with IE9.

    If you open your demo with IE8(Win 7), you'll get the panel empty without chart and chart title.
    Do you know about this? There is no error or warning in the IE browsers, so I do not really have an idea how to get it working.

    Thank you for your shared extension

    Marius
    First I would like to thank you for your time and knowledge

    Win 7 Ext JS 4.1.3 IE(6-9), FF17