I stole some code from Bostock for converting SVG String into an image.

When I manually copy the String by hand from Mathematica Free Form output into the Observable notebook, it works, when I call the Wolfram Cloud and query for it some syntax error appears.

I suspect, as we have seen before, Mathematica fiddles with some quotes when exporting the String.

Off to buy my duckies from farmers markets @ Kilkenney this is first day we are allowed to go to the markets So Please if you see something wrong with the string help out.

In spite of the syntax error all is working, so I am able to run the region computing in Wolfram Cloud and then output the 2D plot into SVG String form into the Observable Notebook, Bostockâ€™s code works great thank you Sir to convert from SVG to String !!

Now I need to figure out how to do regions in 3D and nD.

Some issue with + operator in Mathematica I am going to call Wolfram Techsupport to fix.

If the region computing works and we can connect Wolfram Cloud to Observable notebook then Observable users could do amazing scientific computing like the pros in these cute little notebooks of yours!

There will be no need to load huge number of Python and Fortran libraries and all will be at your finger tips.

In particular you have full calculus on the regions e.g. integration, volume, area, perimeter measures.

You can do booleans on the regions, extract boundaries.

You could also spray regions with random points, compute the shortest distances and etc.

If you have a death wish you could solve differential equations over regions:

The plus sign issue is not a Mathematica issue; itâ€™s a URL issue because plus signs in URLs represent spaces. For example, the URL

https://www.google.com/search?q=expensive+cars

represents the Google search for expensive cars. The place to fix this is on the Javascript side by percent encoding your query. The easy way to do that is to use the encodeURIComponent function. That is, replace your input1 definition

input1 = "implicit region x^2 + y^2=1"

with

input1 = encodeURIComponent("implicit region x^2 + y^2=1")

Note that, without the URL encoding, the plus sign is interpreted as a space which (in Mathematica) yields multiplication, which is why you got the graph you got before.

I added a fancy polynomial region, I will develop the grammar some more tonight to allow the programmers to enter booleans and other functions to compute serious domains suitable for research and etc.

I will also add the Complex domains shortly.

Special note of gratitude to Prof. Mc Clure and Bostock.

Now some nice person tell me how to do the 3D rendering from JSON or some other format, NOT FILE ATTACHMENTS

Since youâ€™re using the Wolfram Cloud anyway, then by far the easiest way to embed a rotatable, 3D image is to simply point to one of their generated cloud objects. Itâ€™s pretty easy to embed those in an iframe, too. Hereâ€™s an Observable notebook that accepts a user defined, free form bivariate function definition, passes that to an API in the Wolfram Cloud, and displays the result in the Observable notebook.

Of course, there might still be reasons that you want to take the output as JSON and render it in Observable. To do so would be considerably more work than the 2D stuff you did with SVG. The reason is that SVG is a well established XML based file format for 2D graphics that Mathematica can export to nicely and that virtually all browsers render natively. The closest thing for 3D would be X3D. While X3D is not natively rendered by the browser, X3Dom is a good Javascript library to render it. Thatâ€™s what I used, for example, to generate this trefoil knot and this 3D Choropleth.

More problematic is Mathematicaâ€™s ability to export X3D, which is limited to be polite. You can read a discussion in this StackExchange thread that I participated in a few years ago.

In Ireland we cannot build basements nor pools, specially in the farmlands where my lab is. So for now a rubber inflatable pool has to do until we pour some above the ground cement box for the girls.