让吉拉敏捷地在chartist.js中被烧毁？
问题
我使用来自jira的json数据来呈现项目的烧毁图表。由于我不想进入的原因，我不能使用内置的Jira敏捷图表。我正在使用chartist.js来呈现燃尽，但我遇到了麻烦，希望chartist.js用户的输入。
我附上了一个图表的图像，我想要生成作为一个参考。
问题
- 烧毁事件在白天不止一次发生。每个人都有自己发生的时间。我不想显示每个发生在x轴标签组中的特定时间。有没有办法在特定的一天“分组”某一天的事件，但表明它们不是一次发生的？
- 我想要创建一个燃尽的“指南”(见附图中的灰色线)。有没有一种简单的方法可以让一行从顶部开始，在给定的时间内在底部结束？
旁白
我一直很喜欢使用chartist.js，但我并没有为我的项目与它结婚，我可以使用任何我想要的图表库。我很乐意接受另一个图表库的建议，它可以做我需要它做的事情。
回答 1
Stack Overflow用户
发布于 2015-06-26 19:57:57
虽然charts不直接支持创建基于时间的图表的方便API (这很快就会结束)，但是我们增加了动态轴配置，允许您将标准的X轴类型(基于step)切换到更复杂的缩放轴。
由于日期将转换为数字和后面的数学场景是一样的，你可以很容易地创建基于时间的图表与一些手工工作。到目前为止，我们还没有基于时间框架的滴答生成器，但这将与不久将在created中创建的TimeAxis一起出现。
要获得有关自定义轴配置的更多信息，可以在这里读取文档：http://gionkunz.github.io/chartist-js/getting-started.html#switching-axis-type
为了向您和其他人展示实现燃尽图是多么容易，我用Chaper0.9.1为您创建了一个。我使用moment.js来格式化日期。
以下是jsbin：http://jsbin.com/lokozu/edit?html,js,output
var chart = new Chartist.Line('.ct-chart', {
series: [{
name: 'remaining',
data: [
{x: new Date(143134652600), y: 53},
{x: new Date(143334652600), y: 40},
{x: new Date(143354652600), y: 45},
{x: new Date(143356652600), y: 41},
{x: new Date(143366652600), y: 40},
{x: new Date(143368652600), y: 38},
{x: new Date(143378652600), y: 34},
{x: new Date(143568652600), y: 32},
{x: new Date(143569652600), y: 18},
{x: new Date(143579652600), y: 11}
]
}, {
name: 'stories',
data: [
{x: new Date(143134652600), y: 53},
{x: new Date(143334652600), y: 30},
{x: new Date(143384652600), y: 30},
{x: new Date(143568652600), y: 10}
]
}]
}, {
axisX: {
type: Chartist.FixedScaleAxis,
divisor: 5,
labelInterpolationFnc: function(value) {
return moment(value).format('MMM D');
}
},
axisY: {
onlyInteger: true,
low: 0
},
series: {
remaining: {
lineSmooth: Chartist.Interpolation.step(),
showPoint: false
},
stories: {
lineSmooth: false
}
}
});https://stackoverflow.com/questions/30855630
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号