Flot - 设置行垂直顺序（z-index）

Question

我有一个折线图，其中包含约 30 个不同颜色的系列，下面有一个 html 表格，其中每个表格行代表一个系列，我在表格行上创建了一个 .hover() 处理程序，以便当您将鼠标悬停在一行上时图表上的系列除对应行外变为灰色

所以没有悬停，图表看起来像这样......

桌子悬停时看起来像......

问题是，我还想让这个选定的系列显示在所有其他系列的顶部（它的 z-index），我看不到任何选项来做到这一点

我尝试重新排序系列数组以将所选系列放在数组的前面，然后调用 plot.draw() 但这对顺序没有任何影响（见下文）

关于如何实现这一点的任何想法？

                                    for(var i=0;i<_st_usage_json.length;i++){
                                        var json = _st_usage_json[i];
                                        var row = jQuery("<tr></tr>")
                                            .data("index",i)
                                            .hover(function(){

                                                if(selectedSeriesIndex!=jQuery(this).data("index")){
                                                    selectedSeriesIndex = jQuery(this).data("index");
                                                    var plot = jQuery("#poolUsagePlot").data("plot")
                                                    var series = plot.getData();
                                                    for (var i = 0; i < series.length; ++i) {
                                                        series[i].color = "rgb(100,100,100)";
                                                    }
                                                    var selectedSeries = series[selectedSeriesIndex];
                                                    selectedSeries.color = 'rgb(0,183,255)';
                                                    series.splice(selectedSeriesIndex,1);
                                                    series.unshift(selectedSeries);
                                                    console.log(series)
                                                    plot.draw();
                                                }


                                            })

Answer 1

您的想法是对的，但需要将所选系列放在数组的末尾，而不是开头。

系列是按顺序绘制的，为了使选定的一个覆盖其他系列，它需要最后绘制。