How To Implement Mouse Hover Data Label Popups On Matplotlib Chart In Kivy

I'm trying to use matplotlib in Kivy with a line chart that has interactive data label popups when the mouse hovers over various points in the chart. I know that this can be done i

Solution 1:

I figured out how to make the popup labels show as you move the mouse over the various points on the chart. Here is what worked for me:

import kivy
import time
import matplotlib
matplotlib.use('module://kivy.garden.matplotlib.backend_kivy')
import matplotlib.pyplot as plt
from kivy.garden.matplotlib import FigureCanvasKivyAgg
from matplotlib.ticker import (MultipleLocator, FormatStrFormatter, AutoMinorLocator)
from kivy.app import App
from kivy.uix.boxlayout import BoxLayout
from kivy.uix.floatlayout import FloatLayout
from kivy.uix.button import Button
from kivy.uix.label import Label
from kivy.properties import BooleanProperty, ListProperty, StringProperty, 
ObjectProperty
from kivy.core.window import Window

class testyApp(App):

    def __init__(self, **kwargs):
        super(testyApp, self).__init__(**kwargs)

    def build(self):
        global line1
        global x
        global y
        global popup_label

        # create the matplotlib chart and add it to the kivy float layout
        mylayout = FloatLayout()
        self.fig = plt.figure()
        self.ax = plt.axes()
        self.plt_canvas = self.fig.canvas
        mylayout.add_widget(self.plt_canvas)

        # load x and y axis data into variables and plot the points in the 
        chart
        xv = 0
        yv = 0
        x = []
        y = []
        for i in range(0, 31):
            xv = xv + 1
            yv = yv + 10
            x.append(xv)
            y.append(yv)
        line1, = plt.plot(x, y)

        # set x and y axis labels and chart title
        plt.xlabel('Countries')
        plt.ylabel('Population in million')
        plt.title('Pakistan Population till 2010')

        # enable mouse hover event
        self.fig.canvas.mpl_connect("motion_notify_event", self.mouse_hover)

        # create starting label and make it invisible
        popup_label = self.ax.annotate("", xy=(0, 0), xytext=(0, 0)) 
        popup_label.set_visible(False) 

        return mylayout

     def show_popup_label(self):
        # changes the coordinates and text of the popup label and makes it 
        # visible when the mouse hovers over a point on the line..
        text = "(" + str(found_x) + ", " + str(found_y) + ")"
        popup_label.set_text(text)
        popup_label.set_position((found_x, found_y))
        popup_label.set_visible(True)
        self.fig.canvas.draw()

    def hide_popup_label(self):
        # hides the popup label when the mouse is NOT on a point on the line
        popup_label.set_visible(False)
        self.fig.canvas.draw()

    def mouse_hover(self, event):
        # mouse hover event to track position of mouse on matplotlib chart 
        # and trigger show/hide popup label tasks
        global found_x
        global found_y
        xd, yd = event.xdata, event.ydata
        active, ind = line1.contains(event) # check to see if the mouse is 
        # hovering over any of the points on the line..
        if active: # if the mouse is hovering over a point on the line 
        # then..
            pos = str([ind["ind"][0]]) # fetch the array position of the 
            # point..
            pos = pos.replace("[", "")
            pos = pos.replace("]", "")
            found_x = x[int(pos)] # use the array position to figure out its 
            # x and y cordinates that we stored in the x and y lists above..
            found_y = y[int(pos)]
            self.show_popup_label() 
        else: # if the mouse is NOT hovering over a point on the line then..
            self.hide_popup_label()

if __name__ == '__main__':
    testyApp().run()