“翻转/镜像”浮动图表

Question

我正在使用一个叫做Lorikeet的框架，它是由Flot Javascript框架构建的。 目前我能够用自己的图表的基本用法，它显示了一个很好的曲线图这样：

然而，我的终极目标是让一字排开这样两个不同的图表：

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

本质上，我如何使它能够显示百分比从100％降到0％并回到升序100％，以及显示一个“镜像”数据集强度？

编辑：

这是我迄今所做的： http://hologos.org/stackoverflow/html/example_use%20-%20Copy.html 我只能创建两个独立的图表，有相同的缩放功能与原。

Answer 1

下面是一个绘制两个flot图的例子，一个是另一个的镜子。关键是使用y轴变换函数，将允许轴运行在“反向”：

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; } 
         } 
        } 
); 

例here。