`
atian25
  • 浏览: 468798 次
  • 性别: Icon_minigender_1
  • 来自: 广州
社区版块
存档分类
最新评论

ExtJS3.x 随笔(2010-07-08更新)

阅读更多

谨用该贴来记录一些使用extjs过程中的笔记吧. 不时更新.

 

2010-07-02

 

1. extjs chart bug

 

1)显示/隐藏chart(X轴为时间轴)的时候,会出现时间渲染函数失效的情况.

xAxis: new Ext.chart.TimeAxis({
  displayName: '时间',
  labelRenderer : Ext.util.Format.dateRenderer('H:i')
})

 暂时没有仔细去分析源码,估计是显示隐藏的时候,那个函数被覆盖掉了.

 现在的解决方式是不显示/隐藏,而是重新生成.

 

2)跨月的时候,坐标轴错误,坐标点都挤到最后面去了.

环境是:extjs 3.2.0 , 用法是每半小时一个点,成功率折线图(所以共48个点).

测试了下,发现是当跨月的时候会出该问题.

 

暂时的解决方法是,因为我们的x轴显示不需要显示日期,所以在store的Field里面判断了下,如果跨月,就日期前移一天.

{
  name:'finishTime',type:'date',dateFormat:'Y-m-d H:i:s',
  convert:function(v,r){
    var date = Date.parseDate(r.finishTime,'Y-m-d H:i:s');
    if(date.getDate()==1){
      //如果日期为该月的第一天,则往前移动一天
      return date.add(Date.DAY,-1);
    }else if(date.getDate()==date.getLastDateOfMonth().getDate()){
      //如果日期为该月的最后一天,则往前移动一天
      return date.add(Date.DAY,-1);
    }
     return date;
  }
}
 

 

2.在Menu中放置一个DateField,点击的时候会隐藏的问题.

 

主要是因为DateField中还有个DateMenu,2个menu冲突了

var dateField = new Ext.form.DateField({
    fieldLabel:'日期1',
    menu: new Ext.menu.DateMenu({
      hideOnClick: false,
      allowOtherMenus: true
    })
  })
 

相关阅读: <ExtJS Menu嵌套combo等控件时,自动隐藏/遮盖等bug的解决方案>

http://atian25.iteye.com/blog/441476

 

 

3.To be continue

 

//tz

分享到:
评论
5 楼 zxm94w 2011-10-27  
atian25 写道
zxm94w 写道
atian25 写道
考虑用4.x吧 那图表才是王道


呵呵,项目做了一半不能随便换的哈,不过好在大体上搞出来了,这还要感谢你那么多帖子,几乎翻了个遍,哈哈。就剩下一个小问题:如何格式化X轴(时间轴),后台传来的是时间字符串,想格式化一下,不知道怎么整,尝试了几个方法都没能成功。
将X轴定义成TimeAxis,貌似是new出来的,所以坐标就不会显示我后台的数据。
想通过labelRenderer:Ext.util.format.date(date,format)来实现,
但是不知道如何获取X轴上的这个date,主要对labelRenderer还不是很熟悉。

你可有什么法子?谢谢了。



labelRenderer应该不难吧,翻下源码就知道了,我记得之前我弄过的.现在不碰3.x了.
另一个歪路是,在store里面加一个字段,映射到你的date字段,在里面格式化,类似:
{name:'dateStr',mapping:'dateField1',convert:function(v,r){return v.format('Y-M-D')})




偏方很给力  特来说声:谢谢!
是要抽空看看源码了,呵呵。。。
谢谢哈!
4 楼 atian25 2011-10-27  
zxm94w 写道
atian25 写道
考虑用4.x吧 那图表才是王道


呵呵,项目做了一半不能随便换的哈,不过好在大体上搞出来了,这还要感谢你那么多帖子,几乎翻了个遍,哈哈。就剩下一个小问题:如何格式化X轴(时间轴),后台传来的是时间字符串,想格式化一下,不知道怎么整,尝试了几个方法都没能成功。
将X轴定义成TimeAxis,貌似是new出来的,所以坐标就不会显示我后台的数据。
想通过labelRenderer:Ext.util.format.date(date,format)来实现,
但是不知道如何获取X轴上的这个date,主要对labelRenderer还不是很熟悉。

你可有什么法子?谢谢了。



labelRenderer应该不难吧,翻下源码就知道了,我记得之前我弄过的.现在不碰3.x了.
另一个歪路是,在store里面加一个字段,映射到你的date字段,在里面格式化,类似:
{name:'dateStr',mapping:'dateField1',convert:function(v,r){return v.format('Y-M-D')})
3 楼 zxm94w 2011-10-26  
atian25 写道
考虑用4.x吧 那图表才是王道


呵呵,项目做了一半不能随便换的哈,不过好在大体上搞出来了,这还要感谢你那么多帖子,几乎翻了个遍,哈哈。就剩下一个小问题:如何格式化X轴(时间轴),后台传来的是时间字符串,想格式化一下,不知道怎么整,尝试了几个方法都没能成功。
将X轴定义成TimeAxis,貌似是new出来的,所以坐标就不会显示我后台的数据。
想通过labelRenderer:Ext.util.format.date(date,format)来实现,
但是不知道如何获取X轴上的这个date,主要对labelRenderer还不是很熟悉。

你可有什么法子?谢谢了。
2 楼 atian25 2011-10-21  
考虑用4.x吧 那图表才是王道
1 楼 zxm94w 2011-10-20  
楼主,你好,最近在做一个项目需要实现曲线图,刚巧使用的是ExtJs3.2,从网上找了不少这方面的信息,可是都未能实现,3.2的样例试了一下,貌似也不行,不知道楼主可有这方面的文档或者完整的代码,如果有请发到我的邮箱zxm94w@126.com,十分感谢!

相关推荐

    Extjs3.x入门学习

    ExtJS 是一个强大的JavaScript库,主要用于构建富客户端的Web应用程序。...同时,ExtJS 3.x虽然已有些许年代,但其设计理念和许多核心功能在后续版本中仍然保留,因此掌握3.x的基础对理解和学习更新版本也有很大帮助。

    extjs3.x 官方示例以及chm版api

    综上所述,"extjs3.x 官方示例以及chm版api"为开发者提供了一套完整的ExtJS 3.x 学习和开发资源,包括实际的示例应用和详细的API文档,是深入理解和掌握这一版本ExtJS的关键工具。通过学习和实践,开发者可以高效地...

    ExtJS 多文件上传 UploadDialog For ExtJS3.x

    ### ExtJS 多文件上传 UploadDialog For ExtJS3.x #### 概述 在Web开发领域,特别是使用ExtJS框架进行界面设计时,文件上传功能是必不可少的一部分。然而,随着ExtJS版本的更新,原有的多文件上传组件可能不再兼容...

    ExtJS 3.x中文API

    3. **数据绑定(Data Binding)**:ExtJS的数据绑定机制使得视图层可以直接与数据源同步,实现数据驱动的UI更新。Store、Model和Proxy是数据绑定的三大组成部分。 4. **表单(Forms)**:ExtJS提供了强大的表单创建...

    ExtJS3.x 中文API CHM 格式

    ExtJS3.x 中文帮助文档,是 CHM 格式的,方便阅读和查询。本人正在使用,效果不错,共享出来,方便大家。

    ext-lang-en.js和ext-lang-zh_CN.js

    Extjs中实现国际化要用到的文件ext-lang-zh_CN.js和ext-lang-en.js

    extjs6.2加SenchaCmd-6.5.3.6-windows-64bit

    ExtJS 6.2与Sencha Cmd 6.5.3.6是Web应用程序开发中的两个关键工具,尤其在构建基于JavaScript的富客户端应用时。本文将深入探讨这两个组件及其在Windows 64位环境下的使用。 首先,ExtJS是一个强大的JavaScript...

    extjs3.x+swfupload.swf多文件上传终结版

    ExtJS 3.x 和 SWFUpload 是两种不同的技术,它们结合使用可以实现高效的多文件上传功能。这篇内容将深入解析这两个技术以及它们如何协同工作。 **ExtJS 3.x** ExtJS 是一个流行的JavaScript库,主要用于构建富...

    ExtJS2.X 版本app

    ExtJS2.X 版本app 这个版本目前找不到了噢

    nexus-3.27.0-03-win64.zip

    最新版的maven私服安装包,nexus-3.27.0-03-win64.zip 。Nexus是一个强大的...Nexus 使用ExtJS来开发界面,利用Restlet来提供完整的REST APIs,通过m2eclipse与Eclipse集成使用。Nexus支持WebDAV与LDAP安全身份认证

    ExtJS实现多文件上传UploadDialog For ExtJS3.x

    在本文中,我们将深入探讨如何使用ExtJS 3.x实现多文件上传功能,结合Struts2框架进行数据处理。首先,我们需要确保环境配置正确。在描述中提到,我们需要将一系列Struts2相关的库文件复制到项目的`WebContent\lib`...

    EXTJS六种皮肤。

    将css文件放入ext-2.0.2/resources/css下,将对应的图片文件夹放入ext-2.0.2/resources/images下。页面引用,例:${ctx}/ext-2.0.2/resources/css/xtheme-black.css" /&gt;

    extjs 3.x upload上传组件

    ExtJS 3.x Upload上传组件是基于ExtJS 3.x版本的一个功能强大的文件上传工具,它为Web应用程序提供了用户友好的界面和灵活的文件管理功能。这个组件在Web开发中非常实用,尤其对于需要处理大量文件上传的项目,如...

    ExtJs 2.X API

    详细的介绍了EXT2.X各种对象的属性、方法、事件

    Python库 | collective.js.extjs-1.4.0.tar.gz

    资源分类:Python库 所属语言:Python 资源全名:collective.js.extjs-1.4.0.tar.gz 资源来源:官方 安装方法:https://lanzao.blog.csdn.net/article/details/101784059

    SenchaCmd-6.0.0.202-windows-64bit.exe

    ExtJS也有自己的打包工具 SenchaCmd,它用来生成构建ExtJS前端组织架构,最后打包发布生产,操控着前端整个开发生命周期,SenchaCmd依赖于JDK,所以要先安装JDK文件 ,安装步骤自行百度.

    extjs4.x tabpanel 动态加载panel和html例子

    在EXTJS 4.x框架中,`tabpanel`是用于创建多标签界面的组件,它可以方便地组织和切换多个视图。动态加载panel和HTML到tabpanel是提高应用性能和用户体验的有效方式,因为它允许按需加载内容,减少初始页面加载时间。...

    extjs 3.x hightchart 插件

    在本案例中,我们将讨论如何在ExtJS 3.x版本中整合Highcharts 2.05插件,以提升图表的展示效果。 首先,让我们了解`Ext.ux.HighChart.js`这个文件。它是专门为ExtJS设计的一个用户扩展(UX),用于集成Highcharts的...

    Extjs4.X下comboboxTree下拉树型菜单,完美支持多选、单选,绝对好用

    在ExtJS 4.x框架中,ComboboxTree是一种特殊的组件,它将传统的下拉框与树形结构结合在一起,提供了一种更为灵活的用户输入方式。这种组件在数据选择上非常实用,尤其当数据层级关系复杂时,可以方便地进行多选或...

Global site tag (gtag.js) - Google Analytics