адаптация плагина mpl3d для работы с гистограммами - PullRequest
Новая
       7

адаптация плагина mpl3d для работы с гистограммами

0 голосов
/ 14 сентября 2018

Я начинаю работать с библиотекой mpld3 для создания интерактивных графиков с помощью matplotlib. javascript это не мой лучший язык, поэтому у меня возникли проблемы с адаптацией уже опубликованных плагинов под мои нужды. Более конкретно, я хочу взять этот плагин и заставить его работать с гистограммой, это означает, что данный бар должен становиться «сплошным», когда на него наведен курсор, и сохранять прозрачность в противном случае. моя попытка: 

class Highlightbars(plugins.PluginBase):
    """A plugin to highlight bars on hover"""

    JAVASCRIPT = """
    mpld3.register_plugin("barhighlight", barHighlightPlugin);
    barHighlightPlugin.prototype = Object.create(mpld3.Plugin.prototype);
    barHighlightPlugin.prototype.constructor = barHighlightPlugin;
    barHighlightPlugin.prototype.requiredProps = ["bar_ids"];
    barHighlightPlugin.prototype.defaultProps = {alpha_bg:0.3, alpha_fg:1.0}
    function barHighlightPlugin(fig, props){
        mpld3.Plugin.call(this, fig, props);
    };

    barHighlightPlugin.prototype.draw = function(){
      for(var i=0; i<this.props.bars.length; i++){
         var obj = mpld3.get_element(this.props.bars[i], this.fig),
             alpha_fg = this.props.alpha_fg;
             alpha_bg = this.props.alpha_bg;
         obj.elements()
             .on("mouseover", function(d, i){
                            d3.select(this.bars[i]).transition().duration(50)
                              .style("stroke-opacity", alpha_fg); })
             .on("mouseout", function(d, i){
                            d3.select(this.bars[i]).transition().duration(200)
                              .style("stroke-opacity", alpha_bg); });
      }
    };
    """

    def __init__(self, bars):
        self.bars = bars
        self.dict_ = {"type": "barhighlight",
                      "bar_ids": [utils.get_id(bar) for bar in bars],
                      "alpha_bg": bars[0].get_alpha(),
                      "alpha_fg": 1.0}

argument = np.array([10,20,30,40,50])
fig, ax = plt.subplots()
bar = ax.bar(x=range(len(argument)),height=argument, alpha=0.2)
plugins.connect(fig, HighlightLines(bar))

mpld3.display()

но это не работает, как я ожидал, на самом деле ничего не изменилось. Я думаю, что это связано с тем, что я совсем не понимаю, как элементы сюжета взаимодействуют с кодом javascript. Есть ли простой способ адаптировать этот плагин?

...