分享一个基于事件时间线的Javascript类库-Chronoline

在线演示本地下载

Chronoline.js是一个javascript的类库用来帮助开发者创建一个按时间来展示的时间线。

整个时间线水平方向显示，我们可以方便的显示任何时间长度的事件，并且提供一个tooltip来展示事件详细内容。

主要特性

需要类库：

raphael.js: 2.1.0
jQuery: 1.7.2
qTip2: 04/24/12 nightly

支持浏览器：

Internet Explorer 8+ (except the tooltips)
Firefox 12+
Chrome 18+

整个类库支持拖放，支持屏幕横向滚动。

如何使用

倒入类库：

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="chronoline/jquery.qtip.min.css" />
<script type="text/javascript" src="chronoline/jquery.qtip.min.js"></script>
<script type="text/javascript" src="chronoline/raphael-min.js"></script>
<link rel="stylesheet" type="text/css" href="chronoline/chronoline.css" />
<script type="text/javascript" src="chronoline/chronoline.js"></script>

实例一个时间线：

var timeline1 = new Chronoline(document.getElementById("target1"), events,
{animated: true,tooltips: true,defaultStartDate: new Date(2012, 3, 5),sections: sections,sectionLabelAttrs: {'fill': '#997e3d', 'font-weight': 'bold'},
});

如果你需要使用时间轴方式来展示你的事件，Chronoline.js是一个不错的选择，希望大家喜欢！如果你有任何问题，请给我们留言！

转载于:https://www.cnblogs.com/gbin1/archive/2012/06/12/2546584.html

分享一个基于事件时间线的Javascript类库-Chronoline相关推荐

[UWP]分享一个基于HSV色轮的调色板应用
原文:[UWP]分享一个基于HSV色轮的调色板应用 1. 前言上一篇文章介绍了HSV色轮,这次分享一个基于HSV色轮的调色板应用,应用地址:ColorfulBox - Microsoft Store ...
分享一个基于 ABP(.NET 5.0) + vue-element-admin 管理后台
1.前言分享一个基于ABP(.NET 5.0) + vue-element-admin项目.希望可以降低新手对于ABP框架的学习成本,感兴趣的同学可以下载项目启动运行一下.对于想选型采用ABP框架的 ...
分享一个基于Vue3+TS构建Cesium组件库
分享一个基于Vue3+TS构建Cesium组件库点击进入 Vue Cesium官网 //vc-navigation <template><el-row ref="view ...
分享一个基于 Spring Boot 的在线教育平台系统
今天给大家开源一个基于springboot的在线教育平台系统,系统是小孟开发的,第一个版本是小锋开发的.该系统完全免费.白嫖.系统完美运行.具体的介绍如下所示. 1. 技术介绍核心技术:Spring ...
SQL Server 2012笔记分享-48：备份时间线
备份时间线是SQL server 2012数据库恢复顾问页面中的一项重要新功能,可以让我们更方便的基于备份时间点进行数据库的恢复. 在SQL server 2012的还原数据库界面,可以找到时间线,如 ...
分享一个基于.NET6包含DDD,ES,CQRS等概念的开源项目
当你在学习DDD.CQRS或时间溯源时,除了大量的学习资源(比如书籍和文章)之外,你还接触到了许多概念,这些资源只是在讨论理论问题.这很好,我们知道他们在说什么,但我们如何在一个真正的项目中使用他们呢 ...
分享一个WebGL开发的网站-用JavaScript + WebGL开发3D模型
这张图每位程序员应该都深有感触. 人民心目中的程序员是这样的:坐在电脑面前噼里啪啦敲着键盘,运键如飞. 现实中程序员是这样的:编码5分钟,调试两小时. 今天我要给大家分享一个用WebGL开发的网站,感 ...
安信可分享 | 分享一个基于airkiss协议的配网小程序，实现小程序一键配网安信可ESP32C3\ESP8266\ESP32\ESP32S2系列的模组。(附带源码)
文章目录一.关于 WeChatAirkiss 1.1 应用场景二.airkiss 简介三.开始使用四.API说明五.FAQ 六.开源微信物联网控制一览表联系我们一.关于 WeChatAi ...
common-jdbc:一个基于SpringJdbcTemplate的高性能数据库操作工具类库
项目地址:https://gitee.com/cnsugar/common-jdbc 一.简介基于SpringJdbcTemplate的高性能数据库操作工具类库,支持mysql.oracle数据库, ...

分享一个基于事件时间线的Javascript类库-Chronoline

主要特性

如何使用

分享一个基于事件时间线的Javascript类库-Chronoline相关推荐

最新文章

热门文章