1. #1
    Sencha User
    Join Date
    Nov 2012
    Posts
    1
    Vote Rating
    0
    kunal seth is on a distinguished road

      0  

    Default Chart rendered in browser but not displayed up on button click

    Chart rendered in browser but not displayed up on button click


    function getcharts(){
    Ext.application({
    requires:
    ['Ext.chart.*',
    'Ext.Window', 'Ext.fx.target.Sprite', 'Ext.layout.container.Fit', 'Ext.window.MessageBox']
    ,
    name: 'AppName',
    launch: function () {
    Ext.onReady(function () {
    var store = Ext.create('Ext.data.JsonStore', {
    fields: ['name', 'data1'], //, 'data2', 'data3', 'data4', 'data5'],
    data: [
    { 'name': 'BNWDev15', 'data1': 10 }
    //{ 'name': 'BNWDev15', 'data1': 10, 'data2': 12, 'data3': 14, 'data4': 8, 'data5': 13 }//,
    // { 'name': 'BNWDev15', 'data1': 7, 'data2': 8, 'data3': 16, 'data4': 10, 'data5': 3 },
    // { 'name': 'BNWDev16', 'data1': 5, 'data2': 2, 'data3': 14, 'data4': 12, 'data5': 7 },
    // { 'name': 'BNWDev16', 'data1': 2, 'data2': 14, 'data3': 6, 'data4': 1, 'data5': 23 },
    // { 'name': 'BNWDev16', 'data1': 27, 'data2': 38, 'data3': 36, 'data4': 13, 'data5': 33 }
    ]
    });
    var colors = ['rgb(47, 162, 223)',
    'rgb(60, 133, 46)',
    'rgb(234, 102, 17)',
    'rgb(154, 176, 213)',
    'rgb(186, 10, 25)',
    'rgb(40, 40, 40)'];


    Ext.chart.theme.Browser = Ext.extend(Ext.chart.theme.Base, {
    constructor: function (config) {
    Ext.chart.theme.Base.prototype.constructor.call(this, Ext.apply({
    colors: colors
    }, config));
    }
    });
    var chart1 = new Ext.create('Ext.chart.Chart', {
    //renderTo: Ext.get('finalcontent'),
    width: 500,
    height: 300,
    animate: true,
    store: store,
    theme: 'Browser:gradients',
    axes: [{
    type: 'Numeric',
    position: 'bottom',
    fields: ['data1'],
    label: {
    renderer: Ext.util.Format.numberRenderer('0,0')
    },
    title: 'Error Count',
    grid: true,
    style: { fill: 'red' },
    minimum: 0
    }, {
    type: 'Category',
    position: 'left',
    fields: ['name'],
    title: 'Server Name'
    }],
    series: [{
    type: 'bar',
    axis: 'bottom',
    //highlight: true,
    /*tips: {
    //trackMouse: true,
    width: 840,
    height: 28,
    renderer: function (storeItem, item) {
    this.setTitle(storeItem.get('name') + ': ' + storeItem.get('data1') + ' views');
    }
    },*/
    label: {
    display: 'insideEnd',
    field: 'data1',
    renderer: Ext.util.Format.numberRenderer('0'),
    orientation: 'horizontal',
    color: '#000',
    'text-anchor': 'middle'
    },
    xField: 'name',
    yField: 'data1',
    style: {
    lineWidth: 1,
    stroke: '#666',
    color: 'red'//,
    //opacity: 0.86
    }
    }]
    });
    Ext.create(Ext.panel.Panel, {
    bodyStyle: 'background-color:green',
    width: 550,
    layout: 'fit',
    title: 'Ebix Chart',
    renderTo: 'finalcontent',
    items: chart1,
    html: '<b>TEST 01</b>'
    });



    });
    }
    });
    }

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


    Why do you have Ext.onReady within Ext.application's launch method? You shouldn't have the Ext.onReady in there
    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.

Thread Participants: 1