pie-chart not drawing using external json file - extjs

pie-chart not drawing using external json file - extjs

in the below code i was trying to draw a pie-chart using extjs, but
pie-chart is not displaying.............
when i does pass the json through ajax, inline its working, but when i
passed through a file its not working
can anyone please tell me some solution for this
myjson.json
{"graphobject":[{"name":"ABC","data":2},
{"name":"DEF","data":12},
{"name":"GHI","data":3},
{"name":"JKL","data":3}]
}
app.js
Ext.onReady(function() {
Ext.define('User', {
extend: 'Ext.data.Model',
fields: [ {
name: 'name',
type: 'string'
}, {
name: 'data',
type: 'int'
}]
});
var store= Ext.create('Ext.data.Store', {
storeId: 'user',
model: 'User',
autoLoad: true,
proxy: {
type: 'ajax',
url: 'C:/myjson.json',
reader: {
type: 'json',
root: 'graphobject'
}
}
});
Ext.create('Ext.chart.Chart', {
renderTo: 'myExample',
width: 450,
height: 320,
legend: {
position: 'right'
},
animate: true,
store: store,
theme: 'Base:gradients',
series: [{
type: 'pie',
angleField: 'data',
showInLegend: true,
tips: {
trackMouse: true,
width: 140,
height: 28,
renderer: function(storeItem, item) {
var total = 0;
store.each(function(rec) {
total += rec.get('data');
});
this.setTitle(storeItem.get('name') + ': ' +
Math.round(storeItem.get('data') / total * 100) +
'%');
}
},
highlight: {
segment: {
margin: 20
}
},
label: {
field: 'name',
display: 'rotate',
contrast: true,
font: '18px Arial'
}
}]
});
});
index.html
:
<div id="myExample"></div>
: