Example wheel of fortune in Forge UI does not work

I download the example of macro of wheel of fortune written in Forge UI

https://developer.atlassian.com/platform/forge/example-apps/#wheel-of-fortune-app

I get it deployed and installed by forge and saw that spin button but there is no wheel shown and no animation was seen. It seems that the SVG markdown is not supported!?

Hi @ZheGin ,

For the wheel of fortune to appear on the page, you’ll need a table with the options on the same page.

Here is an example:

The main logic is from here:
https://bitbucket.org/atlassian/forge-wheel-of-fortune/src/456072e8e6a899eef92bd4bbda7b6d44731889f2/src/index.tsx#lines-90

Where we can see that the app requests the content of the page and then adds each row from the table as a wheel segment.

If there is no table on the page or no rows in the table, then there will be no segments to populate the wheel of fortune and therefore it will just show the black triangle:

Hope this helps (and yes, it could be clearer in the tutorial README).
Caterina

Wow, you got it. Very hard to figure it out without reading the source. May I ask if there is anything I could resize the wheel panel in the edit mode, it is page-wide and too big. How could I make it resizable (with mouse)?

Hey @ZheGin,

Not sure if that’s what you are looking for, but what about using the layout options that show up when clicking on the Macro in Edit mode:
image

The other options could be Inline Macros, but they are not supported yet and the request is tracked here: [FRGE-511] - Ecosystem Jira

Cheers,
Caterina

Thanks for your reply. The option can make it wider, but seems no option to change it smaller or to arbitrary size.

Only the last option will make the frame use the entire width of the page, while the first two will make the macro frame as well as the wheel itself smaller.

What happens when you click on the first two options, can you maybe share a screenshot?

Thanks,
Caterina