Set cables variable from javascript

[VhArno]

Link to simple, reproducible example patch
https://cables.gl/p/6KSE4y

Describe the bug
I am unable to set the value of a variable from outside of cables.gl. I have followed a YouTube tutorial video and tried the same stuff in the video for myself but nothing worked (see third and fourth screenshot). I am embedding my patch (see second screenshot).
My project is written in Vue.js 3.0.

Trying to set cables variable in code:

Cables.gl patch embedded:

Trying to set cables.gl variable in console:

[pandrr]

• check the docs here: https://cables.gl/docs/4_export_embed/dev_embed_vars/dev_embed_vars it is setVariable, not setVar or setVarValue

• in the console, you have to select the frame where you execute code, use editoriframe:

• embedding remote url from cables.gl via iframe, you cannot set vars like this

[VhArno]

Is there another way to set variables from my website? The console was just an example and to show it didn't work. Could I maybe export my cables patch a different way to set the variable?

[steam0r]

if you export the patch as html you should be able to set all these variables:

https://cables.gl/docs/4_export_embed/dev_embed/export_zip/export_zip

[VhArno]

I exported the patch as html adn put in in my Vue.js project. However I cant change the width or height. it stays the same (width: 1139px, height: 919px). Also when switching to a different page on my website the patch dissapears. There are no errors shown when switching page, only on the first load.

These are the console errors when initially loading the page:

Also another error I have no idea how to fix or why it is even there. In my patch I do a request to a wikidata endpoint and display the received data. When I embed my patch as an iframe on my page that request fails because of cors only on Firefox, on Google Chrome or Edge it works perfectly. I do the same request on my website and in cables.gl. The one in cables fails with the following

error: Cross-Origin Request Blocked: The Same Origin Policy disallows reading the external resource at https://dbpedia.org/sparql?query=%0APREFIX%20dbo%3A%20%3Chttp%3A%2F%2Fdbpedia.org%2Fontology%2F%3E%0A%0ASELECT%20%3Fcountry%20%3Fcapital%0AWHERE%20%7B%0A%20%20%3Fcountry%20dbo%3Acapital%20%3Fcapital%20.%0A%20%20%3Fcountry%20a%20dbo%3ACountry%20.%0A%7D%0ALIMIT%2010%0A&format=json . (Reason: CORS header ‘Access-Control-Allow-Origin’ does not match ‘https://linksphere.arnovanhee.ikdoeict.be’).

My website: https://linksphere.arnovanhee.ikdoeict.be/
My cables.gl patch: https://cables.gl/p/6KSE4y