Custom polygon vertices not translating to JS

[bsclod]

OS: MacOS Monterey
PsychoPy version : 2022.2.4
Standard Standalone? yes
What are you trying to achieve?: Custom polygons - diamonds missing a corner (classic visual search stimuli). I used the shape tool in builder and specified custom vertices. [[0,1],[0.6,0.4],[0.6,-0.4],[0,-1],[-1,0]]

What specifically went wrong?:
Stimuli display as intended locally (see above), but online the polygons are regular diamonds that do not include the specified vertices (see below).

I’m not sure if error messages are related. I am new to this. You’ll also notice the sizes are different between local and online… I can live with that but it’s another thing I don’t understand yet. Any help is much appreciated!

[bsclod]

I found an old related post (see below) saying that rect stim are the only option when converting to js. I suppose my best option may be using image files instead of code?

Number of vertices does not work in ShapeStim (Polygon)

Hi, In the standalone version i can create a circle by creating a Polygon with a high number of vertices but in the JS Version the polygon appears rectangular. Version is 3.0.2

[wakecarter]

I create custom polygons online in code components, e.g.

shapes = []
#square
shapes.append(['square',[[.707,-.707],[-.707,-.707],[-.707,.707],[.707,.707]],' '])

#triangle
shapes.append(['triangle',[[.866,-.5],[-.866,-.5],[0,1]],' '])

#circle
shapes.append(['circle',[[0.000,0.866], [0.091,0.861], [0.180,0.847], [0.268,0.824], [0.352,0.791], [0.433,0.750], [0.509,0.701], [0.579,0.644], [0.644,0.579], [0.701,0.509], [0.750,0.433], [0.791,0.352], [0.824,0.268], [0.847,0.180], [0.861,0.091], [0.866,0.000], [0.861,-0.091], [0.847,-0.180], [0.824,-0.268], [0.791,-0.352], [0.750,-0.433], [0.701,-0.509], [0.644,-0.579], [0.579,-0.644], [0.509,-0.701], [0.433,-0.750], [0.352,-0.791], [0.268,-0.824], [0.180,-0.847], [0.091,-0.861], [0.000,-0.866], [-0.091,-0.861], [-0.180,-0.847], [-0.268,-0.824], [-0.352,-0.791], [-0.433,-0.750], [-0.509,-0.701], [-0.579,-0.644], [-0.644,-0.579], [-0.701,-0.509], [-0.750,-0.433], [-0.791,-0.352], [-0.824,-0.268], [-0.847,-0.180], [-0.861,-0.091], [-0.866,0.000], [-0.861,0.091], [-0.847,0.180], [-0.824,0.268], [-0.791,0.352], [-0.750,0.433], [-0.701,0.509], [-0.644,0.579], [-0.579,0.644], [-0.509,0.701], [-0.433,0.750], [-0.352,0.791], [-0.268,0.824], [-0.180,0.847], [-0.091,0.861]],' '])

#diamond
shapes.append(['diamond',[[1,0],[0,-1],[-1,0],[0,1]],' '])

#pentagon
shapes.append(['pentagon',[[0,1],[.951,.309],[.588,-.809],[-.588,-.809],[-.951,.309]],' '])

#hexagon
shapes.append(['hexagon',[[1,0],[.5,-.866],[-.5,-.866],[-1,0],[-.5,.866],[.5,.866]],' '])

#octagon
shapes.append(['octagon',[[1,0],[.707,-.707],[0,-1],[-.707,-.707],[-1,0],[-.707,.707],[0,1],[.707,.707]],'n '])

#heptagon
shapes.append(['heptagon',[[0,-1],[-.782,-.623],[-.975,.223],[-.434,.901],[.434,.901],[.975,.223],[.782,-.623]],' '])

#cross
shapes.append(['cross',[[1,.25],[1,-.25],[.25,-.25],[.25,-1],[-.25,-1],[-.25,-.25],[-1,-.25],[-1,.25],[-.25,.25],[-.25,1],[.25,1],[.25,.25]],' '])

#parallelogram
shapes.append(['parallelogram',[[1,.707],[.5,-.707],[-1,-.707],[-.5,.707]],' '])

#four pointed star
shapes.append(['star',[[1,0],[.25,-.25],[0,-1],[-.25,-.25],[-1,0],[-.25,.25],[0,1],[.25,.25]],' '])

#trapezium
shapes.append(['trapezium',[[.5,.707],[1,-.707],[-1,-.707],[-.5,.707]],' '])

shuffle(shapes)
nShapes = 3

pic = []
for Idx in range(nShapes):
        pic.append(visual.ShapeStim(
        win=win,
        fillColor=white,
        lineColor=white,
        vertices=shapes[Idx][1],
        pos = [0,0],
        size=.2
        ))

It should work in the component as well. What does not yet work (to the best of my knowledge) is changing the vertices of a shape once it has been created. You would therefore need to pre-create each of the different diamonds and switch between them or move/recolour as needed.

[bsclod]

Thanks so much @wakecarter!
My final solution was simply to set the vertices for each shape in a code component (see below). Hope this helps someone else.