开源中国

我们不支持 IE 10 及以下版本浏览器

It appears you’re using an unsupported browser

为了获得更好的浏览体验,我们强烈建议您使用较新版本的 Chrome、 Firefox、 Safari 等,或者升级到最新版本的IE浏览器。 如果您使用的是 IE 11 或以上版本,请关闭“兼容性视图”。
Labella.js首页、文档和下载 - 时间轴标签放置工具 - 开源中国社区
Float_left Icon_close
全部项目分类
我要评价
Apache
JavaScript
跨平台
Twitter
分享
收藏
167 人收藏
收录时间:2015-12-04
Labella.js 详细介绍

Labella.js 是 Twitter 开源的时间轴标签放置工具,可以把标签没有重叠的放在时间轴上。

“标签也可以很美丽”

在线演示:http://twitter.github.io/labella.js/ 

示例代码:

// idealPos: The most preferred position for each label
// width:    The width of each label
var nodes = [
  new labella.Node(1, 50), // idealPos, width
  new labella.Node(2, 50),
  new labella.Node(3, 50),
  new labella.Node(3, 50),
  new labella.Node(3, 50),
];
var force = new labella.Force()
  .nodes(nodes)
  // Listen when the nodes' positions are updated.
  .on('end', function(){
    // The rendering is independent from this library.
    // User can use canvas, svg or any library to draw the labels.
    // There is also a built-in helper labella.Renderer for this purpose. See the examples
    draw(force.nodes());
  })
  // Run simulation at most 100 rounds. It may end earlier if equillibrium is reached.
  .start(100);



大家对 Labella.js 的评论 (全部 1 条评论)
{{repayCom.userName}}
顶部