How to add four trackbars to plot?

[San4ezz_]

I can't add any sliders for plot to adjust polygon coordinates.
all sliders should only move the points along the x-axis.

import numpy as np
from matplotlib.patches import Polygon
import matplotlib.pyplot as plt
from matplotlib.widgets import Slider

# Define initial parameters

bl = 200 #bottom left point
tl = 400 #top left point
tr = 600 #top right point
br = 1080 #bottom right point

# Create the figure and the line that we will manipulate

img = 'test1.jpg'
im = plt.imread(img)
fig, ax = plt.subplots()
im = ax.imshow(im, extent=[0, 1080, 0, 720])
pts = np.array([[bl,0], [tl,340], [tr,340], [br,0]])
p = Polygon(pts, closed=True, alpha=0.4, fc='green', ec="red")
ax = plt.gca()
ax.add_patch(p)

# adjust the main plot to make room for the sliders
fig.subplots_adjust(left=0.3, bottom=0.3)

# Make a point slider to edit coordinates.
bleft = fig.add_axes([0, 2, 4,8])
bleft_slider = Slider(
ax=bleft,
label='bl',
valmin=1,
valmax=1080,
valinit=bl,
)
bright = fig.add_axes([0, 2, 4,8])
bright_slider = Slider(
ax=bright,
label='br',
valmin=1,
valmax=1080,
valinit=br,
)

tleft = fig.add_axes([0, 2, 4,8])
tleft_slider = Slider(
ax=tleft,
label="tl",
valmin=1,
valmax=1080,
valinit=tl,
orientation="vertical"
)

tright = fig.add_axes([0, 2, 4,8])
tright_slider = Slider(
ax=tright,
label="tr",
valmin=1,
valmax=1080,
valinit=tr,
orientation="vertical"
)


# The function to be called anytime a slider's value changes
def update(val):
pts.data(tleft_slider.val, bleft_slider.val, bright_slider.val, tright_slider.val)
fig.canvas.draw_idle()


# register the update function with each slider
bleft_slider.on_changed(update)
bright_slider.on_changed(update)
tleft_slider.on_changed(update)
tright_slider.on_changed(update)



plt.show()

 

[Josmellon]

It looks like you are trying to create four sliders to adjust the coordinates of the vertices of a polygon. Here's one way you could do this:

1. First, you'll want to change the update function to update the coordinates of the vertices of the polygon based on the values of the sliders. You can do this by updating the pts array and then calling the set_xy method of the Polygon object with the updated pts array as the argument. You'll also want to update the limits of the x-axis to reflect the range of the sliders. Here's how the updated update function would look:

def update(val):
    # Update the coordinates of the vertices
    pts[0][0] = bleft_slider.val
    pts[1][0] = tleft_slider.val
    pts[2][0] = tright_slider.val
    pts[3][0] = bright_slider.val
    # Update the Polygon object with the new coordinates
    p.set_xy(pts)
    # Update the limits of the x-axis
    ax.set_xlim(bleft_slider.val, bright_slider.val)
    fig.canvas.draw_idle()

1. Next, you'll want to adjust the layout of the sliders so that they are positioned correctly on the plot. You can do this by using the left, bottom, width, and height arguments of the add_axes method to specify the position and size of each slider. For example, you could place the "bl" slider at the bottom left corner of the plot with a width of 0.2 and a height of 0.05 like this:

bleft = fig.add_axes([0.1, 0.1, 0.2, 0.05])

1. Finally, you'll want to make sure that the update function is called whenever the value of a slider is changed. You can do this by registering the update function as the on_changed callback of each slider.

 

[San4ezz_]

Thank you very much for your answer, now I can manage the polygon! But I still want to ask: when changing the width of the polygon, the plot itself changes, how to make the length and width of the plot static?



New code:

import numpy as np

from matplotlib.patches import Polygon

import matplotlib.pyplot as plt

from matplotlib.widgets import Slider



# Define initial parameters



bl = 200 #bottom left point

tl = 400 #top left point

tr = 600 #top right point

br = 1080 #bottom right point



# Create the figure and the line that we will manipulate



img = 'test1.jpg'

im = plt.imread(img)

fig, ax = plt.subplots()





im = ax.imshow(im, extent=[0, 1080, 0, 720])

pts = np.array([[200,0], [400,340], [600,340], [1080,0]]) #

p = Polygon(pts, closed=True, alpha=0.4, fc='green', ec="black")

ax = plt.gca()

ax.add_patch(p)



# adjust the main plot to make room for the sliders

fig.subplots_adjust(bottom=0.4)



# Make a point slider to edit coordinates.

bleft = fig.add_axes([0.20, 0.27, 0.63, 0.05])

bleft_slider = Slider(

    ax=bleft,

    label='bottom-left',

    valmin=1,

    valmax=1080,

    valinit=200,

)



tleft = fig.add_axes([0.20, 0.20, 0.63, 0.05])

tleft_slider = Slider(

    ax=tleft,

    label="top-left",

    valmin=1,

    valmax=1080,

    valinit=342

)



tright = fig.add_axes([0.20, 0.13, 0.63, 0.05])# позиция слайдера (отступ слева, отступ снизу, ширина, длина)

tright_slider = Slider(

    ax=tright,

    label="top-right",

    valmin=1,

    valmax=1080,

    valinit=600,



)

bright = plt.axes([0.20, 0.06, 0.63, 0.05])

bright_slider = Slider(

    ax=bright,

    label='bottom-right',

    valmin=1,

    valmax=1080,

    valinit=1080,

    closedmax=True

)





# The function to be called anytime a slider's value changes



def update(val):

    # Update the coordinates of the vertices

    pts[0][0] = bleft_slider.val

    pts[1][0] = tleft_slider.val

    pts[2][0] = tright_slider.val

    pts[3][0] = bright_slider.val

    # Update the Polygon object with the new coordinates

    p.set_xy(pts)

    # Update the limits of the x-axis

    ax.set_xlim(bleft_slider.val, bright_slider.val)

    fig.canvas.draw_idle()







# register the update function with each slider

bleft_slider.on_changed(update)

bright_slider.on_changed(update)

tleft_slider.on_changed(update)

tright_slider.on_changed(update)







plt.show()