Ext.onReady(function(){
    
    var data = [{"户籍区划":"海南区","人数":97132,"男性":50839,"女性":46293},{"户籍区划":"乌达区","人数":133321,"男性":68023,"女性":65297},{"户籍区划":"海勃湾区","人数":191882,"男性":97115,"女性":94767}];
    var fields = ["户籍区划","人数", "男性", "女性"];
    
    var store = Ext.create('Ext.data.JsonStore', {
        fields: fields,
        data: data
    });
    
    var chart = Ext.create('Ext.chart.Chart', {
        xtype: 'chart',
        animate: true,
        style: 'background:#fff',
        shadow: false,
        legend: {
            position: 'right'
        },
        store: store,
        axes: [{
            type: 'Numeric',
            position: 'left',
            fields: ["人数", "男性", "女性"],
            grid:true,
            minimum: 0
        }, {
            type: 'Category',
            position: 'bottom',
            fields: ["户籍区划"]
        }],
        series: [
            {
                "type":"line",
                "axis":"bottom",
                "highight":true,
                "xField":"户籍区划",
                "yField":"人数"
            },
            {
                "type":"line",
                "axis":"bottom",
                "highight":true,
                "xField":"户籍区划",
                "yField":"男性"
            },
            {
                "type":"line",
                "axis":"bottom",
                "highight":true,
                "xField":"户籍区划",
                "yField":"女性"
            }
        ]

    });
    
    var win = Ext.create('Ext.panel.Panel', {
        width: 600,
        height: 400,
        minHeight: 400,
        minWidth: 550,
        hidden: false,
        maximizable: true,
        title: 'Bar Chart',
        renderTo: Ext.getBody(),
        layout: 'fit',
        items: chart
    });

});