Dygraph中的垂直绘图
Vertical graphing in Dygraph?
我想在web项目中使用Dygraph,但我需要以"垂直"的方式绘制线条——这意味着——通常是X轴(水平,沿着底部),我需要从上到下绘制(X轴沿着左边缘)。
我看了几个图形库,似乎没有一个支持它。我最近发现了Dygraph,所以我希望它可能有这个功能。
虽然竖线图不支持开箱即用,但使用CSS转换可以实现这种效果。基本上,将包含图表的<div>
旋转90度,然后撤消标签的转换。
一个dygraph用户能够得到这项工作。请参阅此演示。
用于旋转图形的css:
.graphStyle {
transform: rotate(90deg) translate(280px,240px);
}
.dygraph-axis-label.dygraph-axis-label-x {
transform: rotate(-90deg) translate(-20px, 0);
}
.dygraph-axis-label.dygraph-axis-label-y {
transform: rotate(-90deg) translate(-10px,10px);
}
.dygraph-legend {
transform: translate(-320px,-300px) rotate(-90deg);}
翻译是把图表放在我想要的地方,你必须改变它们。
相关文章:
- Canvas Html5绘图应用程序,移动画布会导致重大问题
- 跟踪jqplot垂直折线图的鼠标位置
- HTML画布在绘图后立即擦除矩形
- 如何在JS Leatflet绘图插件中获取圆的坐标
- 如何设置自定义垂直滑块Jquery的动画
- 在一个页面中具有多个捕捉绘图和捕捉内容
- 使用Jquery Issue垂直重新排序Divs
- SVG手写字母绘图动画
- 简单的垂直上一个和下一个按钮代码点击上下移动jQuery
- 无法将文本与图片垂直对齐
- CodeMirror.禁用垂直滚动条
- 绘图悬停文本未显示
- 阻止文本区域垂直滚动
- 计算一个垂直于直线的点
- 使用jquery垂直对齐动态加载的图像
- 如何使 DIV 中的内容垂直对齐
- 为画布绘图添加鼠标事件
- HTML中的垂直进度条
- 如何强制绘图将x轴编号显示为类别
- Dygraph中的垂直绘图