3

リンクされた情報を使用していくつかの mpld3 プロットを作成しています。ポイント (現在ツールチップが表示されています) をクリックできるようにしたいと思います。現在、ツールチップに HTML リンクを埋め込むことはできますが、マウスをホバーしようとするとツールチップが消えるため、クリックできません。これは可能ですか?

これは、私が行ったことと、私が考えていることを示すサンプルページです: http://www.eso.org/~aginsbur/EAACTF/EAACTF_plots_long.html

編集:受け入れられた回答に基づく私の解決策は次のとおりです。

class ClickInfo(mpld3.plugins.PluginBase):
    """mpld3 Plugin for getting info on click
    Comes from:
        http://stackoverflow.com/a/28838652/814354
    """

    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);
        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
        self.dict_ = {"type": "clickinfo",
                      "id": mpld3.utils.get_id(points, suffix),
                      "urls": urls}

次に、次のように使用されます。

                    tooltip = mpld3.plugins.PointHTMLTooltip(points, labels,
                                                             voffset=10,
                                                             hoffset=10)
                    mpld3.plugins.connect(fig, tooltip)
                    mpld3.plugins.connect(fig, ClickInfo(points, urls))
4

1 に答える 1

6

これを行うための新しいプラグインを作成できると思います。ポイントがクリックされたときに警告を表示するプラグインの例を次に示します。

を に変更することで、新しいページを開くように変更できalert(...);ますwindow.open(url, '_blank')});

   class ClickInfo(mpld3.plugins.PluginBase):
    """mpld3 Plugin for getting info on click        """

    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);
        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
        self.dict_ = {"type": "clickinfo",
                      "id": mpld3.utils.get_id(points, suffix),
                      "urls": urls}


fig, ax = plt.subplots()
points = ax.scatter(np.random.rand(50), np.random.rand(50),
                    s=500, alpha=0.3)
urls = ["http://example.com/#%d"%i for i in range(50)]

plugins.connect(fig, ClickInfo(points, urls))
mpld3.display()
于 2015-03-03T17:57:52.760 に答える