Embeding a notebook as an iframe

Community Help
1

How can I make the example of https://observablehq.com/@mbostock/embedded-notebook work for my charts ?

Changing the linked chart from one of Mike’s to one of mine as done here raise the following CORS issue.

Access to script at 'https://api.observablehq.com/@maliky/simple-line-chart-to-embed-in-resizable-react-components.tgz?v=3' from origin 'https://maliky.static.observableusercontent.com' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

Thank you

2

Change the .tgz in this line:

import define from "https://api.observablehq.com/@maliky/simple-line-chart-to-embed-in-resizable-react-components.tgz?v=3";

to js:

import define from "https://api.observablehq.com/@maliky/simple-line-chart-to-embed-in-resizable-react-components.js?v=3";
1 Like
3

Ho ! You’re observable fu is strong :). Thank you very much. I hope I’ll remember that for next time.

4

Do you know why the iframe does not fill the vertical space when height is set to 100% but it does so for the horizontal space when width is set to 100% ?

How can I make that iframe fill a div that is changing shape with (or without) the preserveAspectRatio of view port ?