Thank you for reporting this bug. We will make it our priority to review this report.
  1. #1
    Sencha User
    Join Date
    Apr 2012
    Posts
    40
    Vote Rating
    0
    jwbworks is on a distinguished road

      0  

    Default Unanswered: having problems with basic pie coding

    Unanswered: having problems with basic pie coding


    hello all I need help I am using the basic pie sample code from the docs site and it is erroring out. what am I doing wrong.

    here is my index.html

    Code:
    <!DOCTYPE html><html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>Retirement Plan</title>
        <link rel="stylesheet" type="text/css" href="resources/css/sencha-touch.css"/>
        <link rel="stylesheet" type="text/css" href="resources/css/touch-charts.css"/>
        <link rel="stylesheet" type="text/css" href="resources/css/main.css"/>
        <script type="text/javascript" src="touch/sencha-touch-all-debug.js"></script>
        <script type="text/javascript" src="touch/touch-charts-debug.js"></script>
        <script>
            // Fix for problem  with android 3.x and 4.x which is
            // the browser has a problem with urls with ? and this
            // bug has not been fixed by google.  See:
            // http://code.google.com/p/android/issues/detail?id=17535 or
            // http://www.sencha.com/forum/showthread.php?162322-Sencha-Touch-2-PhoneGap-are-not-working-on-Android-4/page3&highlight=Loader
            //
            
            Ext.Loader.setConfig({ disableCaching: false });
            Ext.Ajax.setDisableCaching(false);    
        </script>	
        <script type="text/javascript" src="app.js"></script>
        <script type="text/javascript">
            if (!Ext.browser.is.WebKit) {
                alert("The current browser is unsupported.\n\nSupported browsers:\n" +
                    "Google Chrome\n" +
                    "Apple Safari\n" +
                    "Mobile Safari (iOS)\n" +
                    "Android Browser\n" +
                    "BlackBerry Browser"
                );
            }
        </script>
    </head>
    <body></body>
    </html>
    next here is the code I am using for the pie chart

    Code:
    var contribChartStore = new Ext.data.JsonStore({    fields: ['name', 'data1', 'data2', 'data3', 'data4', 'data5'],
        data: [
            {'name':'metric one', 'data1':10, 'data2':12, 'data3':14, 'data4':8, 'data5':13},
            {'name':'metric two', 'data1':7, 'data2':8, 'data3':16, 'data4':10, 'data5':3},
            {'name':'metric three', 'data1':5, 'data2':2, 'data3':14, 'data4':12, 'data5':7},
            {'name':'metric four', 'data1':2, 'data2':14, 'data3':6, 'data4':1, 'data5':23},
            {'name':'metric five', 'data1':27, 'data2':38, 'data3':36, 'data4':13, 'data5':33}
        ]
    });
    
    
    Ext.define('MyLifeNowMobile.view.override.contribChart_Module', {
        requires: 'MyLifeNowMobile.view.contribChart_Module'
    }); 
        contribChart = new Ext.chart.Chart({
                renderTo: Ext.getBody(),
                width: 500,
                height: 300,
                animate: true,
                store: contribChartStore,
                theme: 'Base:gradients',
                series: [{
                    type: 'pie',
                    angleField: 'data1',
                    showInLegend: true,
                    tips: {
                      trackMouse: true,
                          width: 140,
                          height: 28,
                          renderer: function(storeItem, item) {
                            //calculate and display percentage on hover
                            var total = 0;
                            store.each(function(rec) { total += rec.get('data1'); });
                              this.setTitle(storeItem.get('name') + ': ' + Math.round(storeItem.get('data1') / total * 100) + '%');
                          }
                    },
                    highlight: {
                        segment: {
                        margin: 20
                    }
                },
                label: {
                    field: 'name',
                    display: 'rotate',
                    contrast: true,
                    font: '18px Arial'
                }
            }]
            });
    var contribChartPage =  Ext.ComponentQuery.query('contribChart_Module');
    var contribChartPageView= contribChartPage[0];
    contribChartPageView.add(contribChart);
    lastly I am getting the following error

    Uncaught TypeError: Cannot read property 'selectors' of undefined

    in the chart library that points to
    themes.push(Ext.chart.theme[themeName || me.getTheme()].selectors.slice());

    any thoughts?

    thanks jeff

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,532
    Vote Rating
    871
    Answers
    3564
    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


    Did you set a breakpoint and see what Ext.chart.theme[themeName || me.getTheme()] or any part of that is referring to?
    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
    Jan 2011
    Posts
    27
    Vote Rating
    0
    lilford.immanuel is on a distinguished road

      0  

    Default


    Hi,
    I get Ext.chart.theme.Base returns undefined..

    Thanks in advance