拿平板发表博客 好费劲，代码 是从hg 里拷过来的，晚上不爱开电脑，明天单位整理下格式
extjs 雷达图表 页面第一次 加载 从后台返回数据 x 轴 渲染 不出来，
由于 项目原因 雷达数据要在页面初始化的时候 加载 虽然数据 返回到前台 但是x 轴的 汉字 是没有显示出来，这样就导致 图表 无法正常显示，找原因 找了好久 最后才知道 extjs 是在数据 返回之前 就渲染了图表，解决方法就是 给图表 先赋上初始值，附上代码如下:
//#############################################################
836 //#1.单月柱形图和雷达图Model
837 //#2.单月社会存销比，柱形图store
838 //#3.单月社会存销比，柱形图chart
839 //#4.单月社会存销比，雷达图store
840 //#5.单月社会存销比，雷达图chart
841 //#6.单月社会存销比，报表chartPanel
842 //#############################################################
843
844
845 //===========================单月柱形图和雷达图Model============================
846 Ext.define('columnAndRadarModel', {
847 extend: 'Ext.data.Model',
848 fields: [
849 {
850 name: 'xdata'
851 }, //x轴显示
852 {
853 name: 'ydata'
854 } //y轴显示
855 ]
856 });
857 //=============================end======================================
858
859
860
861 //===================================单月社会存销比，柱形图store==============================
862 var singleSaveAndSaleColumnStore = Ext.create('Ext.data.ArrayStore', {
863 model: 'columnAndRadarModel',
864 autoLoad: false,
865 // 设置服务器端映射。
866 proxy: {
867 type: 'ajax',
868 url: 'chart/stock/getChartSocietyStocksAllType',
869 // 定义数据结构
870 reader: {
871 type: 'json',
872 root: 'root'
873 }
874 }
875 });
876 //=======================================end======================================
877
878
879
880 //==================================单月社会存销比，柱形图chart===============================
881 var singleSaveAndSaleColumnChart = Ext.create('Ext.chart.Chart', {
882 width: document.body.clientWidth * 0.5 * 0.3 ,
883 height:document.body.clientHeight * 0.5,
884 xtype: 'chart',
885 style: 'background:#fff',
886 animate: true,
887 theme:'Category1',
888 store: singleSaveAndSaleColumnStore,
889 axes: [{
890 type: 'Numeric',
891 position: 'left',
892 minimum: 0,
893 grid: true,
894 label: {
895 renderer:function(v){
896 return Ext.util.Format.round(v,1);
897 },
898 font: '10px Arial'
899 }
900 }, {
901 type: 'Category',
902 position: 'bottom',
903 fields: ['xdata'],
904 label: {
905 renderer: function(v){
906 return markerMap.get(v);
907 },
908 font: '12px Arial'
909 }
910
911 }],
912 series: [
913 {
914 type: 'column',
915 width: 70,
916 height: 25,
917 axis: 'left',
918 xField: 'xdata',
919 yField: 'ydata',
920 style:{
921 'width':40
922 },
923 tips: {
924 trackMouse: true,
925 width: 60,
926 height: 24,
927 renderer: function(storeItem, item){
928 this.setTitle((0==storeItem.get('ydata')?"0":storeItem.get('ydata')));
929 }
930 }
931 }
932 ]
933 });
934 //=======================================end=====================================
935
936 //==================================单月社会存销比，雷达图store===============================
937 var singleSaveAndSaleRadarStore = Ext.create('Ext.data.ArrayStore', {
938 model: 'columnAndRadarModel',
939 autoLoad: false,
940 // 设置服务器端映射。
941 proxy: {
942 type: 'ajax',
943 url: 'chart/stock/getChartSocietyStocksAllType',
944 // 定义数据结构
945 reader: {
946 type: 'json',
947 root: 'root'
948 }
949 }
950 });
951 //=======================================end=====================================
952
953
954 //==================================单月社会存销比，雷达图chart==============================
955 var singleSaveAndSaleRadarChart = Ext.create('Ext.chart.Chart', {
956 width: document.body.clientWidth * 0.5 * 0.7 ,
957 height:document.body.clientHeight * 0.5,
958 style: 'background:#fff',
959 insetPadding: 20,
960 animate: true,
961 theme:'Category1',
962 store: radarChartStore,
963 axes: [{
964 type: 'Radial',
965 position:'1,14',
966 label: {
967 renderer: function(v){
968 return businessMap.get(v);
969 },
970 font: '12px Arial'
971 },
972 minimum: 0
973 }],
974 series: [{
975 type: 'radar',
976 xField: 'xdata',
977 yField: 'ydata',
978 showInLegend: true,
979 showMarkers: true,
980 markerConfig: {
981 radius: 2,
982 size: 2
983 },
984 style: {
985 opacity: 0.3
986 },
987 tips: {
988 trackMouse: true,
989 width: 60,
990 height: 24,
991 renderer: function(storeItem, item){
992 this.setTitle((0==storeItem.get('ydata')?"0":storeItem.get('ydata')));
993 }
994 }
995
996 }]
997 });
998 //=======================================end============================================
999
1000 //=====================================单月社会存销比，雷达图store，加载开始===============================
1001 singleSaveAndSaleRadarStore.load({
1002 params: {
1003 makeDate: makeDate,
1004 cityCode: cityCode,
1005 brandId: brandId,
1006 dimGoodsId: standardId,
1007 queryType: "stores",
1008 mtkAndbnsFlag: "bns"
1009 },
1010 callback: function(o, response, success){
1011 //改变标题
1012 //Ext.getCmp("singleSaveAndSaleChartPanel_id").setTitle(makeDate.substr(0, 4) + "年" + makeDate.substr(4, makeDate.length) + "月" + " 全品牌 " + "社会存销比");
1013 Ext.getCmp("singleSaveAndSaleChartPanel_id").setTitle("社会存销比" + " 全省" + " 全品牌 ");
1014 //切换图表绑定
1015 singleSaveAndSaleRadarChart.bindStore(singleSaveAndSaleRadarStore,true);
1016 //重绘图表
1017 singleSaveAndSaleRadarChart.redraw();
1018 }
1019 });
1020 //=====================================单月社会存销比，雷达图store，加载结束===============================
1021
1022
1023
1024
1025
1026
1027 //===============================单月社会存销比，报表chartPanel=========================
1028 var singleSaveAndSaleChartPanel = Ext.create('Ext.form.Panel',{
1029 id: "singleSaveAndSaleChartPanel_id",
1030 layout: {
1031 type: 'hbox',
1032 align: 'stretch'
1033 },
1034 title: "社会存销比",
1035 items: [singleSaveAndSaleColumnChart,singleSaveAndSaleRadarChart]
1036 }
1037 );
1038 //======================================end==================================
1039
//创建雷达图表数据集
87 var radarChartStore = Ext.create('Ext.data.ArrayStore', {
88 idIndex: 0,
89 fields: ['xdata', 'ydata']
90 });
91 //初始化雷达图表数据集方法
92 function radarChartStoreInit(){
93 radarChartStore.add({
94 xdata:"食杂店",
95 ydata:""
96 },{
97 xdata:"便利店",
98 ydata:""
99 },{
100 xdata:"超市",
101 ydata:""
102 },{
103 xdata:"商场",
104 ydata:""
105 },{
106 xdata:"烟酒商店",
107 ydata:""
108 },{
109 xdata:"娱乐服务类",
110 ydata:""
111 },{
112 xdata:"其它",
113 ydata:""
114 }
115 );
116 }
117 //执行雷达图表数据集初始化方法
118 radarChartStoreInit();