hide axes and move label over charts

Question

I need to hide the axes and move the label on the charts instead of inside (What I want to see and what I have)!

hide axes and move label over chartsю here's my code I'm working with

`Ext.define('app.view.analytics.AnalyticsBars', { extend: 'Ext.Panel', xtype: 'analyticsbars', controller: 'analyticsbars',

requires: [
    'app.store.AnalyticsBars',
    'app.view.analytics.AnalyticsBarsController'
],

color: 'red',
state: null,
report_id: null,

store_type: 'analyticsbars',

initComponent: function () {

    this.items = [{
        xtype: 'cartesian',
        reference: 'chart',
        autoSize: true,
        // insetPadding: 40,
        flipXY: true,
        animation: {
            easing: 'easeOut',
            duration: 500
        },
        store: {
            type: 'analyticsbars',
            storeId: this.store_type + '_' + this.state,
            report_id: this.report_id,
            state: this.state,
            autoLoad: true,
        },
        axes: [{          
            type: 'numeric',
            position: 'none',
            fields: 'state_percent',
            grid: false,
            minimum: 0,
            maximum: 100,
            majorTickSteps: 0.1,
            renderer: 'onAxisLabelRender'
        }, {
            type: 'category',
            position: 'left',
            fields: 'conselement_name',
            renderer: 'onAxisLabelRender',
        }],
        series: [{
            type: 'bar',
            xField: 'conselement_name',
            yField: 'state_percent',
            highlightCfg: {
                strokeStyle: 'none',
            },
            style: {
                minGapWidth: 20,
                height: 20,
                color: this.color,
                radius: 5,
                strokeStyle: 'none',
            },
            label: {
                field: 'state_percent',
                display: 'outside',
                renderer: 'onSeriesLabelRender',
            },
            tooltip: {
                trackMouse: true,
                renderer: 'onSeriesTooltipRender'
            },
            axis: 'bottom',

        }, {
            type: 'bar',
            xField: 'conselement_name',
            yField: 'state_percent',
            highlightCfg: {
                strokeStyle: 'none',
            },
            style: {
                minGapWidth: 20,
                height: 20,
                color: this.color,
                radius: 5,
                strokeStyle: 'none',
            },
            label: {
                field: 'conselement_name',
                display: 'insideStart',
                renderer: 'onSeriesLabelRender',
            },
            tooltip: {
                trackMouse: true,
                renderer: 'onSeriesTooltipRender'
            },
            axis: 'bottom',
        }
    ]
    }],

        this.callParent(arguments);

},

}) `