🏠 back to Observable

can i run 2 exported notebook in same html page

Hi

i have 2 notebook that i download to my web server to put them in the same page …
why i get this error alternativly for each note book?

zhmap_expro = RuntimeError: d3 could not be resolved
or
zhmap_expan= = RuntimeError: d3 could not be resolved
or
some time i can have both ???

separatly i have not those errors

so it’s seems i have a conflict … but where and why ??

in fine i have this code in my page

   <div id="titr_expan"></div>
   <div class="my-3" id="zhmap_expan"></div>
</div>
<script type="module">
import define from "./gkc_cache/exp_annee/index.js";
import {Runtime, Library, Inspector} from "./gkc_cache/exp_annee/runtime.js";
const runtime = new Runtime();
const renders = {"titr_expan": "#titr_expan","zhmap_expan": "#zhmap_expan"};
   for (let i in renders)
      renders[i] = document.querySelector(renders[i]);
   const main = runtime.module(define, name => {
   if (renders[name])
      return new Inspector(renders[name]);
   else return true;
   })
</script>
<div id="wrapper">
   <div id="titr_expro"></div>
   <div class="my-3" id="zhmap_expro"></div>
   <div class="my-3" id="aide"></div>
</div>
<script type="module">
import define from "./gkc_cache/exp_prov/index.js";
import {Runtime, Library, Inspector} from "./gkc_cache/exp_prov/runtime.js";
const runtime = new Runtime();
const renders = {"titr_expro": "#titr_expro","zhmap_expro": "#zhmap_expro","aide":"#aide"};
   for (let i in renders)
      renders[i] = document.querySelector(renders[i]);
   const main = runtime.module(define, name => {
   if (renders[name])
      return new Inspector(renders[name]);
   else return true;
   })
</script>

my architectur is probably wrong …

here are the 2 Notebooks…


any advice welcome

Thanks

I couldn’t reproduce this problem with your code. Here’s a working example:

https://bl.ocks.org/mbostock/raw/c4afa151bcc164085be8c4ff4e6ecb71/

And the source:

1 Like

thank Mike … arghhh so what’s happens
can be a server side problem ??? because sometime it’s works and sometime no …
or may be the global html context ??
here : http://www.grottes-et-karsts-de-chine.org/npds/gkc_rcex.php

---- nothing to see with my problem but i see you use 4.6.4 runtime and when i download i have 4.6.3 ??

Thank mike i worked on this …
and if i use your code it’s seems to work
BUT
with this way i use the file that are on observable ?..
and i want the file that are on my server (where they are updated …)…
here is my architecture where the purple(“dynamic” file) and green(“static” file) are the file used by the 2 notes books some of those file are used by both notebook …

so the call of the file in the 2 main scripts become :

const fileAttachments = new Map([["prov.json",new URL("http://www.grottes-et-karsts-de-chine.org/npds/gkc_cache/prov.json",import.meta.url)],["karst.json",new URL("http://www.grottes-et-karsts-de-chine.org/npds/gkc_cache/karst.json",import.meta.url)],["exp_annee.csv",new URL("http://www.grottes-et-karsts-de-chine.org/npds/gkc_cache/exp_annee.csv",import.meta.url)]]);
const fileAttachments = new Map([["prov.json",new URL("http://www.grottes-et-karsts-de-chine.org/npds/gkc_cache/prov.json",import.meta.url)],["exp_pro.json",new URL("http://www.grottes-et-karsts-de-chine.org/npds/gkc_cache/exp_pro.json",import.meta.url)],["karst.json",new URL("http://www.grottes-et-karsts-de-chine.org/npds/gkc_cache/karst.json",import.meta.url)]]);

i can not understand why the error are differents sometimes one notebook sometime the other and sometime dead at d3 and sometime dead more far in the code (when parse the csv file ???)

zhmap_expro = RuntimeError: d3 could not be resolved
or sometime dataExp could not be resolved …

some more work for the new year…

i also notice that by this way (2 note book on the same page) i load two times 3djs and 2 times runtime.js and the commons json file … it may be not very efficient …?

… huum still not work well …

Any progress in figuring out how to import the runtime only once?