zoukankan      html  css  js  c++  java
  • Extjs 图表控件,可修改X轴与Y轴坐标

    this.xAxisName = '区县名称';

    this.yAxisName = '站点个数';

    this.store = new Ext.data.ArrayStore({         fields: ['month', 'hits']     }),

    this.analysisPanel = new Ext.chart.ColumnChart({

            store: this.store,

            yField: 'hits',

            title: '站点统计',

            url: '/JS/Ext3.2.0/resources/charts.swf',

            xField: 'month',        

       xAxis: new Ext.chart.CategoryAxis({            

         title: this.xAxisName        

       }),        

       yAxis: new Ext.chart.NumericAxis({

                title: this.yAxisName

            }),        

         extraStyle: {

                xAxis: {labelRotation: -90  }        

       }

    });

    // 重新设定统计窗体的提交后的更新状态

     this.formPanel.form.submit({
            success: function(form, action) {
                    this.parent.analysisPanel.setXAxis(new Ext.chart.CategoryAxis({

             // 读取服务器端的x轴名称
                             title: action.result.xAxisName
                     }));

                     this.parent.analysisPanel.setYAxis(new Ext.chart.NumericAxis({
                              title: action.result.yAxisName
                      }));
                                    
                      this.parent.store.loadData(generateData(action.result.records));

                      this.parent.analysisPanel.refresh();
                      this.parent.analysisWinForm.hide();
              },
              scope: this,
              failure: function(form, action) {
                        Ext.MessageBox.alert('提示', action.result.msg);
                         this.parent.analysisWinForm.hide();
               }
    });

    // 将服务器端返回的数据放到store里面,可以弄一个Json store 来搞...

    function generateData(records) {
        var data=[];
        for (var i = 0; i < records.length; i++) {
            data.push([records[i].Name, records[i].Value]);
        }
        return data;
    }

  • 相关阅读:
    Mysql定时器定时删除表数据
    Mysql中文排序规则
    Swoole学习-Swoole入门指南
    Cygwin安装swoole及错误解决
    php://input ,$_POST, $_GET和$HTTP_RAW_POST_DATA
    tp5-微信消息接收和处理
    [软件工程] 千帆竞发图的制作
    [构建之法论坛] 助教之路
    VS社区版 使用 OpenCover 获取测试代码覆盖率
    支持多编程语言的自动测试系统
  • 原文地址:https://www.cnblogs.com/oftenlin/p/2672246.html
Copyright © 2011-2022 走看看