同一html页上多个mpld3图表上的clickinfo插件问题

50few1ms  于 2021-07-13  发布在  Java
关注(0)|答案(1)|浏览(318)

我在同一个html页面上有两个matplotlib散点图(使用mpld3.fig到html呈现)。我试图使用这个clickinfo插件使图表上的每一点都可以点击(打开另一个显示更多信息的窗口)。
为这些图表生成的html显示不同的id,但是当单击每个点将错误的信息传递到它打开的页面时,一个图表的id与另一个图表的id混淆了。关于如何使用限制元素搜索的信息不多 mpld3.get_element(this.props.id, this.fig); .
如果我在同一页上只有一个图表,这个插件工作得很好。
如果有一个解决方案使这个插件能够在这个用例中工作,那将是一个很大的帮助。

class ClickInfo(plugins.PluginBase):    
    JAVASCRIPT = """
    mpld3.register_plugin("clickinfo", ClickInfo);
    ClickInfo.prototype = Object.create(mpld3.Plugin.prototype);
    ClickInfo.prototype.constructor = ClickInfo;
    ClickInfo.prototype.requiredProps = ["id","urls"];
    function ClickInfo(fig, props){
        mpld3.Plugin.call(this, fig, props);
    };

    ClickInfo.prototype.draw = function(){
        var obj = mpld3.get_element(this.props.id, this.fig);
        urls = this.props.urls;
        obj.elements().on("mousedown",function(d, i){window.open(urls[i], '_blank')});

    }
    """
    def __init__(self, points, urls):
        self.points = points
        self.urls  = urls
        if isinstance(points, matplotlib.lines.Line2D):
            suffix = "pts"
        else:
            suffix = None
        print("+++", mpld3.utils.get_id(points, suffix))
        self.dict_ = {"type": "clickinfo","id": mpld3.utils.get_id(points, suffix=suffix, prefix='el'),"urls":urls}
jchrr9hc

jchrr9hc1#

刚刚发现我的mpld3包的版本(0.5.2)有一个pointhtmltooltip的targets参数,它接受一个url列表,当单击它时会在一个新的窗口/选项卡上打开url并完美地工作。无需使用clickinfo。 mpld3.plugins.PointHTMLTooltip(self, points, labels=None, targets=None, hoffset=0, voffset=10, css=None)

相关问题