javascript - “翻转/镜像”一个 Flot 图表

Question

我正在使用一个名为 Lorikeet 的框架，它是基于 Flot Javascript 框架构建的。目前我能够使用他们对图表的基本用法，它显示了一个很好的图表：

然而，我的最终目标是让两个不同的图表排列成这样：

我的基本问题是如何“翻转/镜像”一个 Flot 图表？

本质上，我如何才能显示从 100% 下降到 0% 并返回到上升 100% 的百分比，以及显示根据强度向下增长的“镜像”数据集？

编辑：

这是我到目前为止所做的：http: //hologos.org/stackoverflow/html/example_use%20-%20Copy.html 我只能创建两个具有与原始图表相同的缩放功能的单独图表。

Answer 1

这是一个绘制两张流动图的例子，一张是另一张的镜像。关键是使用 yaxis 变换函数，该函数将允许轴以“反向”运行：

var somePlot1 = $.plot("#placeholder", 
                  [ {data: d1} ],
                  { 
                      xaxis: { position: 'top'} // place on top
                  }
);
var somePlot2 = $.plot("#placeholder2", 
                  [ {data: d1} ],
                   { 
                       xaxis: { position: 'bottom'}, // place on bottom
                       yaxis: { 
                           ticks: [0.5, 1.0, 1.5, 2.0, 2.5], // custom ticks to avoid overlap on 0
                           transform: function (v) { return -v; }, // run the yaxis in reverse
                           inverseTransform: function (v) { return -v; }
                        } 
                   }
);

这里的例子。