`
li.chening
  • 浏览: 23064 次
  • 性别: Icon_minigender_2
  • 来自: 深圳
社区版块
存档分类
最新评论

flex4实现横坐标从0:00-24:00均匀分布

    博客分类:
  • flex
阅读更多

先上效果图:

横坐标是从0:00到第二天的0:00,每隔2小时显示一个刻度。

这里我用到了lineChart,由于数据源是(data:Number,time:Date)这种形式,则横坐标选择用DateTimeAxis,我这里dataUnits 选择了“hours”(按小时),设定了最小值(minimum)和最大值( maximum)分别设置为一天的0:00和第二天的0:00,这样符合要求的lineChart就出来啦。

 

特别注意:当时我遇到一个问题,lineChart好像只认识0点,而不认识像24点,当java端传时间过来的时候,0点的时间是24点这种形式,使得lineChart显示不出来24:00-1:00这段时间的曲线,所以这里我在得到数据之后,做了转化处理(把24点变成0点这种形式),就可以显示了。

分享到:
评论
2 楼 pengjun170 2011-05-04  

你用这个
dateFormat.formatString="JJ:NN:SS";

去格式化这个横坐标就可以了
1 楼 javafound 2010-09-14  
Flex在精进啊,

相关推荐

    详解解决flex布局的justify-content: space-between对齐方式的一个BUG的两种方法

    当我们将`display`属性设置为`flex`并使用`justify-content: space-between`,Flexbox会将子元素沿主轴方向均匀分布,首尾元素贴紧容器边缘,而剩余空间平均分配到各个元素之间。这对于创建整齐的多列布局非常有用。...

    flex滚动条三种实现方式

    在Flex布局中,我们可以有几种不同的方法来实现滚动条,尽管它们在技术上可能被视为一种实现,但可以以不同的样式呈现。下面我们将详细探讨这些方法。 1. **默认滚动条**: 在不进行任何自定义的情况下,浏览器会...

    详解CSS中的display:flex||inline-flex属性

    主要给大家介绍了CSS中的display:flex和display:inline-flex属性,文中分别通过两段实例代码给大家介绍了display:flex和display:inline-flex的使用效果,感兴趣的朋友们可以参考借鉴,下面来一起看看吧。

    libpcap离线脚本自动安装(含全部依赖gcc,m4,bison,flex,libpcap)

    libpcap(Packet Capture Library)即数据包捕获函数库,是Unix/Linux平台下的网络数据包捕获函数库; libpcap可以实现以下功能: ... 安装包:m4-1.4.19、bison-3.7.6、flex-2.6.4、gcc4.85、libpcap-1.10.1、m4-1.4.19

    FLEX 实现坐标系转换

    坐标转换通常涉及到将坐标从一个坐标系统转换到另一个坐标系统,例如从WGS84(全球定位系统使用的坐标系统)到UTM(统一世界坐标系统),或者从笛卡尔坐标到极坐标等。这个过程涉及到数学公式和地理坐标系统的理解。...

    微信小程序 Flex布局详解

    弹性因子(flex-grow, flex-shrink, flex-basis)在微信小程序的Flex布局中,每个伸缩项目都可以通过flex属性来指定其弹性因子,它是一个简写属性,可以设置三个值:flex-grow, flex-shrink, 和 flex-basis。1. flex...

    flex布局 justify-content 解决最后一排数量不够自动向两端排列问题.doc

    flex布局 justify-content 解决最后一排数量不够自动向两端排列问题,简单,高效,好用。

    css3 flex布局 justify-content:space-between 最后一行左对齐

    在CSS3的Flex布局中,`justify-content: space-between`是一种常见的水平分配方式,它将元素之间的空白均匀分布,首尾元素紧贴容器边界。然而,当你试图通过`justify-self: start`使最后一行的元素左对齐时,你会...

    FLEX教程-FLEX教程

    Demo4:进度条数据绑定 - **数据绑定**: Flex 中的一种强大特性,可以自动同步 UI 元素与数据源之间的值。 - **进度条**: 一个常用的 UI 组件,用于表示任务完成的百分比。 - **实现**: - 创建数据模型。 - 在 ...

    Flex漂亮的柱状图,横坐标倾斜45度显示amChart

    总的来说,`Flex`结合`amChart`能实现美观且功能丰富的柱状图,通过横坐标轴倾斜45度的技巧,可以有效处理长标签显示问题,提高数据可视化的质量和用户体验。在开发过程中,理解并熟练掌握这些特性,将有助于创建出...

    flex 左右分栏 效果

    - **对齐方式**:使用`justify-content`属性控制子元素在主轴上的对齐,如`justify-content: space-between`可以使子元素在主轴上均匀间隔分布,`justify-content: flex-start`则使子元素靠左排列,`justify-...

    Flex布局让子项保持自身高度的实现

    这样设置背景色的时候非常不方便,那么直接在父项上,将align-items设为 flex-start,或者align-items属性的其他值都可以,子项就会保持自身的高度了。 .fat{ display: flex; align-items: flex-start; } 效果如下...

    MyBatis-Flex 一个优雅的 MyBatis 增强框架

    MyBatis-Flex: 一个...4. 更灵动:MyBatis-Flex 支持多主键、多表查询、逻辑删除、乐观锁、数据脱敏、数据加密、多数据源、分库分表、字段权限、字段加密、多租户、事务管理、SQL 审计等特性。 这一切,免费且灵动。

    flex_style.rar_flex_flex style_style flex

    可选值有`flex-start`(默认,靠左/上对齐),`flex-end`(靠右/下对齐),`center`(居中),`space-between`(两端对齐,项目之间均匀间隔),`space-around`(项目周围均匀间隔)。 4. **Align-items属性**: -...

    css解决display:inline-block;产生的缝隙(间隙)的方法

    4. **使用`display: flex`**: 将父元素的`display`属性设置为`flex`,可以方便地控制子元素的布局,而且可以消除间隙: ```css .box { display: flex; overflow-x: auto; background: #fff; } .box span { ...

    直线和折线flex实现经典源码

    content: flex-start`(默认值,所有项目从起点开始)、`justify-content: flex-end`(所有项目靠终点)、`justify-content: center`(所有项目居中)或`justify-content: space-between`(项目之间均匀间隔)等。...

    FLEX4_Flex4教程 - FLEX4从入门到精通,挺不错的值得一看

    Flex4,全称为Adobe Flex 4,是Adobe公司推出的一款用于构建富互联网应用程序(Rich Internet Applications,RIAs)的框架。这个框架基于ActionScript 3.0编程语言和Flash Player或Adobe AIR运行时环境,为开发者...

    FLEX4_flex4教程

    ### FLEX4_flex4教程知识点详解 #### 富互联网应用(RIA)概念与背景 - **RIA定义**: RIA代表“富互联网应用”(Rich Internet Applications),是一种提供类似于桌面应用体验的网络应用形式。 - **RIA背景**: - **C/...

    跟我StepByStep学FLEX教程------王一松

    Demo4:进度条的数据绑定 - **数据绑定原理**:解释数据绑定的基本概念和工作原理。 - **实现步骤**:通过具体实例展示如何使用数据绑定来更新进度条的状态。 #### 10. Demo5:事件Event - **事件类型**:介绍...

    Flex弹性布局详解

    - `flex-start`: 项目从Flex容器沿着主轴方向的起始点到终点进行依次紧密排列。 - `flex-end`: 项目沿着主轴方向紧密排列,但是从终点到起点。 - `center`: 所有内部项目沿着Flex容器的主轴方向进行居中对齐。 -...

Global site tag (gtag.js) - Google Analytics