I’ve been working for some time with a d3 project outside Observable. The project implements an economic model which consumes some file data and visualises it. My goal is to separate off the model and data part only, make it available as a module, and to import this to the Observable ecosphere to do…

Hi — not sure! Could you post an example, even if it’s a small/fake piece of what you’re working on, that captures the pattern you’re describing? At a glance it sounds totally reasonable. Lots of notebooks have a cell with more “raw” data, then another cell that parses/cleans/filters it, and then a …

You may also want to take a look at the following thread, which discusses imports and code structure: [image] import as viewof etc. Community Help I am probably missing something obvious here. How do I import an interaction like Inputs.range()? I might be missing the an…

Hi Thanks, So a toy example: suppose my module is really simple: it exports a function to return a single point from a dataset, which is read from a .csv (or whatever) once on initialisation. Perhaps the dataset is just something like a table of global population against year, and the module export…

p.s. I found this solution but wondered if it was the best pattern.

In Observable you would fetch your data in a separate cell (let’s call it “data”), then have get_population() reference that cell. Authors would import get_population into their notebooks, but could optionally also import data if they desire so. Observable notebooks have no “internal” cells – any na…

Thanks I am beginning to see the light: this is perfect if I want to make my functionality available to other Observable notebooks. My complication is that I would like to is have my function and the data it needs available as a module/package, and have Observable import that.

I see. fs is not available in the browser, and since you already bundle your data with your module, I recommend to wrap the data as an object in an ES module, and have your get_population code import that module. This way you avoid any async fetching, but it requires you to put more effort into your…

Thanks so much for the amazing help: I think I am almost there and you have answered my question I think. Indeed I’m trying not to sweat the small stuff at this stage, but also don’t want to leave the whole packaging bit to the end and realise I’m stuck for want of having made some good choices earl…

[image] stuwilmur: I appreciate this is perhaps a rabbit hole you didn’t need to fall down, but it is extremely useful. Ask as many questions as you want! I’m sure that many have wondered the same, and reading this thread will help them as well. [image] stuwilmur: is this a case of copyi…

Perfect I will see how I get on. Yes I hope others find this; I’m sure they will find is useful as I have done.

Rearchitecting JS project for Observable

Help

mootari October 13, 2022, 6:43am 3

You may also want to take a look at the following thread, which discusses imports and code structure:

Topic		Replies	Views
Export final code? Help	39	22817	December 18, 2018
Where is the data coming from? Uncategorized	2	1510	December 17, 2018
Republishing code on observable Help	4	532	September 20, 2019
From observablehq cell to NPM Help	9	1679	November 12, 2018
Observable's Practical Purpose Feedback	3	613	June 30, 2021

Rearchitecting JS project for Observable

Related topics