# Circle shape was interpreted as shape with four edges(diamond) when rewritten in JS language in pavlovia

**URL:** https://discourse.psychopy.org/t/circle-shape-was-interpreted-as-shape-with-four-edges-diamond-when-rewritten-in-js-language-in-pavlovia/25337
**Category:** Online experiments
**Tags:** screen, online, pavlovia
**Created:** [October 12, 2021, 1:34am UTC](https://discourse.psychopy.org/t/circle-shape-was-interpreted-as-shape-with-four-edges-diamond-when-rewritten-in-js-language-in-pavlovia/25337 "2021-10-12T01:34:36Z")
**Posts on this page:** 4
**Page:** 1

<div class="post-metadata">

### Author: ![Yancheng\_892](https://sea2.discourse-cdn.com/flex002/user_avatar/discourse.psychopy.org/yancheng_892/32/13497_2.png) [@Yancheng\_892](https://discourse.psychopy.org/u/Yancheng_892)
#### Post date: [October 12, 2021, 1:34am UTC](https://discourse.psychopy.org/t/circle-shape-was-interpreted-as-shape-with-four-edges-diamond-when-rewritten-in-js-language-in-pavlovia/25337/1 "2021-10-12T01:34:36Z")

</div>

Hi,  
I used builder + code compenent to build my experiment. I set a lot of circle stimulus through polygon component. However, when I run the online version, all the circles became diamonds. And after carefully checking the .js file, I found in .js file, the circle polygon was initiated as shape with 4 edges. It was differently defined when compared with star shape, which can be correctly showed on screen.

![Snipaste_2021-10-11_17-18-57](https://us1.discourse-cdn.com/flex002/uploads/psychopy/original/3X/c/3/c333fa537e35bb1b77d9eaad79779205c5ae4a63.jpeg)

code example: piece\_2 was defined as cross, and piece\_3 was defined as a circle.  
In .js file：  
piece\_2 = new visual.ShapeStim ({  
win: psychoJS.window, name: ‘piece\_2’,  
**vertices: ‘cross’** , size:circlesize,  
ori: 0.0, pos: [(piecexpos + piecexlag), pieceypos],  
lineWidth: 1.0, lineColor: new util.Color(‘gray’),  
fillColor: new util.Color(‘black’),  
opacity: undefined, depth: -10, interpolate: true,  
});

piece\_3 = new visual.Polygon ({  
win: psychoJS.window, name: ‘piece\_3’,  
**edges: 4** , size:circlesize,  
ori: 0.0, pos: [(piecexpos + (2 \* piecexlag)), pieceypos],  
lineWidth: 1.0, lineColor: new util.Color(‘gray’),  
fillColor: new util.Color(‘black’),  
opacity: undefined, depth: -11, interpolate: true,  
});

In .py file  
piece\_2 = visual.ShapeStim(  
win=win, name=‘piece\_2’, **vertices=‘cross’** ,  
size=circlesize,  
ori=0.0, pos=(piecexpos+piecexlag, pieceypos),  
lineWidth=1.0, colorSpace=‘rgb’, lineColor=‘gray’, fillColor=‘black’,  
opacity=None, depth=-10.0, interpolate=True)  
piece\_3 = visual.ShapeStim(  
win=win, name=‘piece\_3’,  
size=circlesize, **vertices=‘circle’** ,  
ori=0.0, pos=(piecexpos+2\*piecexlag, pieceypos),  
lineWidth=1.0, colorSpace=‘rgb’, lineColor=‘gray’, fillColor=‘black’,  
opacity=None, depth=-11.0, interpolate=True)

Apparently, there is something wrong with .js file. So, I was wondering it is a bug about PsychoPy itself or I changed any possible setting to make this mistake happen?

PsychoPy version: v2021.2.3

Thanks for any feedback  
Tang

* * *

Update:

I tried manually to edit the .js file, replacing " edges: 4 " with " vertice:‘circle’ ". But it failed since the pavlovia returned a mistake. ![图片](https://us1.discourse-cdn.com/flex002/uploads/psychopy/original/3X/2/d/2d285e2199583845b372ef18dd973076ffe5b5a1.png)

---

<div class="post-metadata">

### Author: ![mmagnuski](https://sea2.discourse-cdn.com/flex002/user_avatar/discourse.psychopy.org/mmagnuski/32/11741_2.png) [@mmagnuski](https://discourse.psychopy.org/u/mmagnuski)
#### Post date: [February 11, 2022, 4:51pm UTC](https://discourse.psychopy.org/t/circle-shape-was-interpreted-as-shape-with-four-edges-diamond-when-rewritten-in-js-language-in-pavlovia/25337/2 "2022-02-11T16:51:05Z")

</div>

Hi @Yancheng_892,  
I’m having the same problem. I will try changin the `edges: 4` to something like `edges: 256` and see if this works.  
However, I noticed now, when looking through PsychoJS docs to see if circles are supported that there is the following note there:

> If using circles online use a “regular” polygon with 100 vertices - rather than using the dropdown “circle” option

so this should be the easiest solution to the problem. It would be good if PsychoPy caught that someone is using circle when uploading experiment to pavolovia and warned to use it as advised on the PsychoJS web page.

---

<div class="post-metadata">

### Author: ![mmagnuski](https://sea2.discourse-cdn.com/flex002/user_avatar/discourse.psychopy.org/mmagnuski/32/11741_2.png) [@mmagnuski](https://discourse.psychopy.org/u/mmagnuski)
#### Post date: [February 11, 2022, 8:40pm UTC](https://discourse.psychopy.org/t/circle-shape-was-interpreted-as-shape-with-four-edges-diamond-when-rewritten-in-js-language-in-pavlovia/25337/3 "2022-02-11T20:40:33Z")

</div>

Changing from circle to regular polygon works well irrespective of the number of vertices (I use 256 in big circles and 32 in small ones).

---

<div class="post-metadata">

### Author: ![Yancheng\_892](https://sea2.discourse-cdn.com/flex002/user_avatar/discourse.psychopy.org/yancheng_892/32/13497_2.png) [@Yancheng\_892](https://discourse.psychopy.org/u/Yancheng_892)
#### Post date: [March 3, 2022, 1:34am UTC](https://discourse.psychopy.org/t/circle-shape-was-interpreted-as-shape-with-four-edges-diamond-when-rewritten-in-js-language-in-pavlovia/25337/4 "2022-03-03T01:34:48Z")

</div>

Well, I also used “regular” polygon with 200 vertices to build this circle! It did work! 😁
