当 LineSeries 悬停时获取 QML LineSeries 的名称 - （动态创建的 LineSeries）

Posted 2023-02-16

【中文标题】当 LineSeries 悬停时获取 QML LineSeries 的名称 - （动态创建的 LineSeries）

【英文标题】：Get name of QML LineSeries when the LineSeries is hovered over - (LineSeries created dynamically)

【发布时间】：2019-03-27 20:47:07

【问题描述】：

我试图在悬停时获取对动态创建的 LineSeries 的引用。创建 LinesSeries 后，我将信号处理程序附加到悬停事件。

问题是： 在下面的简化示例中，当我将鼠标悬停在 LineSeries 上时，它会打印出最后添加的 LineSeries 的名称。何时应该打印添加的每个 LineSeries 的系列名称。 例如，如果使用名称 ["Line A", "Line B", "Line C" ] 创建了 3 个 LineSeries，当将鼠标悬停在每一个上时，它应该打印每个相应的名称，但它会为所有 3 个打印“Line C” LineSeries 悬停事件处理程序。我在做什么 错了吗？

//dataset is a dictionary(QVariant) of items where each item is the name of the line series
for(var name in dataset) 
        var series = chart.createSeries(ChartView.SeriesTypeLine, name, xAxis, yAxis);
        series.name = name;

        series.hovered.connect(
                    function (point,state)
                        if (state)
                            console.log(">>>"+ name); // <- should print the name of each series
                        

                    );

我感觉这与将 name 变量的当前值绑定到 onhovered 事件处理程序有关，但我不确定如何执行此操作。我知道在普通的 JS 中他们会做类似的事情

functionName.bind( ... code ... , this );

感谢您的帮助。

--E

【参考方案1】：

name 包含迭代完成时数组的最后一个值，因此连接处理程序将始终采用该值。为了避免这种行为，你应该使用如下的闭包：

    Component.onCompleted: 
        var dataset = ["aaa","bbb","ccc"];

        for(var name in dataset) 
            var series = chart.createSeries(ChartView.SeriesTypeLine, dataset[name], xAxis, yAxis);

            (function(series)
                series.name = dataset[name];                    
                series.hovered.connect(function (point, state)
                
                    if (state)
                    
                        console.log(series.name);
                    
                );
            )(series);

        
     

【讨论】：

谢谢！这是最直接的答案，使用此解决方案，鼠标离开 LineSeries 时也会触发悬停事件。所以我可以用这个if (state) console.log(series.name); else console.log('Exited line series: ' + series.name);

【参考方案2】：

一个可能的解决方案是在 Python 中添加类似于 functools.partial() 的参数，我们很幸运，因为在 this post 中有一个等效的实现：

// https://***.com/a/33261231/6622587
function partial() 
    var args = Array.prototype.slice.call(arguments);
    var fn = args.shift();
    return function() 
        var nextArgs = Array.prototype.slice.call(arguments);
        // replace null values with new arguments
        args.forEach(function(val, i) 
            if (val === null && nextArgs.length) 
                args[i] = nextArgs.shift();
            
        );
        // if we have more supplied arguments than null values
        // then append to argument list
        if (nextArgs.length) 
            nextArgs.forEach(function(val) 
                args.push(val);
            );
        
        return fn.apply(fn, args);
    


// ...

for(var name in dataset) 
    var series = chart.createSeries(ChartView.SeriesTypeLine, name, xAxis, yAxis);
    var fun = function(name, point, state)
        if (state)
            console.log(">>>"+ name);
        
    ;
    series.hovered.connect(partial(fun, name));

【讨论】：

我不确定我是否理解它的工作原理，但确实如此，我会深入研究以进一步了解它。谢谢！唯一的事情是当鼠标离开线系列时它不会触发处理程序，例如for(var name in dataset) var fun = function(name, point, state) if (state) console.log(">>>"+ name); else //THIS NEVER GETS CALLED console.log("EXITED: " + name); ; series.hovered.connect(partial(fun, name));