ramikrispin, to datascience
@ramikrispin@mstdn.social avatar

Getting Started with Observable Framework 👇🏼

Here is a great resource for getting started with Observable Framework by Allison Horst. Observable Framework is an open-source JS library for creating dashboards. The sequence of videos covers how to set up a project and data loader, customize the dashboard, and deploy it.

📽️ https://www.youtube.com/playlist?list=PLOHIJAFwtkEcuVZO6WK-Uuswd09Y2Rk2b

hrbrmstr, to random
@hrbrmstr@mastodon.social avatar

Being able to get mgcv::gam into JS/Observable via {webr} is just the bees knees.

Plot just has basic linear regression (it's nowhere near as robust as geom_smooth()), and it's almost zero effort to slide in fit data from other models thanks to the work of George & team.

hrbrmstr, to random
@hrbrmstr@mastodon.social avatar

It's still very much a WIP but I've got a usable Textbox Plot Mark in development.

It's sort of like a Plot.html, letting you specify HTML code for the mark text, and it renders it.

I now see why this hasn't existed before. Lots of edge cases/gnarly bits.

https://observablehq.com/@hrbrmstr/textbox-mark-html-text-mark

hrbrmstr, to random
@hrbrmstr@mastodon.social avatar

I'm rly backlogged on the #30DayChartChallenge b/c I got nerdswiped trying to make a new #Observable Plot mark for HTML styled text…and it's nearly working!

hrbrmstr, to random
@hrbrmstr@mastodon.social avatar

just added support for installing and using NPM modules! https://github.com/observablehq/framework/releases/tag/v1.6.0

hrbrmstr, to random
@hrbrmstr@mastodon.social avatar

Nothing fancy for the late entry to day 14 of the #30DayChartChallenge. Just a basic Season/Episode ratings #Observable Plot heatmap for selected TV shows from IMDB's catalog.

https://observablehq.com/@hrbrmstr/2024-30-day-chart-challenge-day-14-relationships-heatmap

hrbrmstr, (edited ) to random
@hrbrmstr@mastodon.social avatar

For day 13 of the (relationships/family) we use and to explore the malware families used by threat actors, and let you tap into them to go to the entries on Malpedia.

Totally forgot to post the link yesterday :facepalm: https://observablehq.com/@hrbrmstr/2024-30-day-map-challenge-day-12-relationships-family

hrbrmstr, to random
@hrbrmstr@mastodon.social avatar

For day 10 of the #30DayChartChallenge (distribution/physical) we look at the historical, present, and projected distributions of cargo by travel mode via an interactive #observable notebook that lets you explore each cargo type.

hrbrmstr, to random
@hrbrmstr@mastodon.social avatar

A bit behind on the #30DayChartChallenge (sigh)

Day 9 • Distribution • Major/Minor

We take a look at major/minor quake densities across the globe over the last 30 days.

Nothing groundbreaking, as #Observable Plot makes this pretty easy.

https://observablehq.com/@hrbrmstr/2024-30-day-chart-challenge-day-09-distribution-major-minor

hrbrmstr, to random
@hrbrmstr@mastodon.social avatar

For day 8 of the 2024 #30DayChartChallenge (distribution / circular) we look at the historical make-up of the U.S. Congress (starting with the 32nd) with animated parliament plots in #Observable (#RStats data wrangling code included in the notebook).

https://observablehq.com/@hrbrmstr/2024-30-day-chart-challenge-day-08-distribution-circular

hrbrmstr, to random
@hrbrmstr@mastodon.social avatar

For day 6 (OECD) of I tapped into their database of "trust in the national government" via in .

Unsurprisingly, 🇺🇸 trust is in the 🚽.

Now I gotta dig in a bit more to know why Luxembourg is #1.

https://observablehq.com/@hrbrmstr/2024-30-day-chart-challenge-day-06-oecd

hrbrmstr, (edited ) to random
@hrbrmstr@mastodon.social avatar

For day 5 of the #30DayChartChallenge (diverging) this #Observable notebook looks at 2023 U.S. state migration inbound/outbound flows through two different lenses.

The notebook has #RStats data wrangling code, too.

https://observablehq.com/@hrbrmstr/2024-30-day-chart-challenge-day-4-diverging

hrbrmstr, to random
@hrbrmstr@mastodon.social avatar

#30DayChartChallenge Day 4 • 🧇

Hit up — https://observablehq.com/@hrbrmstr/2024-30-day-chart-challenge-day-04-waffle — to see your GitHub activity % breakdown in a proper waffle chart (via my OBS Plot WafleMark) vs the daft radar chart GitHub uses.

Ended up having to write a Deno edge function to make this data available to #Observable notebooks.

hrbrmstr, to javascript
@hrbrmstr@mastodon.social avatar

2024 Day 03: Makeover

Went back into the blog archives (2017!) to do a modern makeover of my Maine 🦞 landings connected dot plot.

PDF data wrangling all done in .

https://observablehq.com/@hrbrmstr/2024-30-day-chart-challenge-day-03-makeover

hrbrmstr, to random
@hrbrmstr@mastodon.social avatar

#30DayChartChallenge Day 2: Neo

Given how close the date is to the 25th anniversary of The Matrix, I went w/it as the theme (as did many others).

Made a heavily stylized character interactions #Observable Plot cell chart with The Matrix rain in the background.

https://observablehq.com/@hrbrmstr/the-matrix-interactions

hrbrmstr, to random
@hrbrmstr@mastodon.social avatar

2024 • Day 01 • Part To Poll (Whole)

notebook looking @ the 2024 POTUS polling.

wrangling code in the notebook.

https://observablehq.com/@hrbrmstr/2024-30-day-chart-challenge-day-01-part-to-wh-p-ol-l-e

schizanon, to webdev
@schizanon@mastodon.social avatar

I built this POC to demonstrate how I'd use CustomEvents to implement Signals. Please criticize my approach and tell me why I need a native browser API for this.

https://card-calc.surge.sh/

#webDev #javaScript #signals #observable #frontend #customEvents #events #svelte #preact #rxjs

hrbrmstr, to random
@hrbrmstr@mastodon.social avatar

And, I threw together a quick dashboard for VulnCheck's KEV: https://vckev.hrbrmstr.app/

Gotta figure out how to notice when they publish a new one.

search / table / detail

hrbrmstr,
@hrbrmstr@mastodon.social avatar
hrbrmstr, to random
@hrbrmstr@mastodon.social avatar

cannot believe how quick it is to prototype an app using Framework

ramikrispin, to javascript
@ramikrispin@mstdn.social avatar

(1/3) Dashboards with Observable Framework 🚀

The Framework is a new library for building dashboards. It looks super awesome!

Here are the key features:
✅ It enables the building of the dashboard front-end with JS and the use of any other language on the back-end to process the data, such as , , , etc. This is an amazing feature that enables you to bring the beauty and strengths of JS while processing your data with a more friendly framework

🧵 ⬇️

ramikrispin,
@ramikrispin@mstdn.social avatar

(2/3) Key features
✅ It provides a local development server where you can test your code side-by-side with the output
✅ It compiles Markdown, JavaScript, and other sources and static assets
✅ Can be deployed as a static site (did not test yet, but I believe it can be deployed into Github Pages) or deployed directly to Observable

aboutgeo, to random German
@aboutgeo@vis.social avatar
oobleck, to frontend
@oobleck@fosstodon.org avatar

@frontend
I find very powerful, yet quite unintuitive. I think I've got it, but I had a bugger of a time writing a custom operator that does this for any given -like stream in a generic way:

Pause the source stream until stream2 completes. Then replay the last emission from the source. Then allow all subsequent emissions from the source unimpeded.

hrbrmstr, to javascript
@hrbrmstr@mastodon.social avatar

Day 4 of combo + in are up.

I deserve to be on 🧑🏼‍🎄's naughty list for the R solutions, tho.

Also finally got the notebook collection permissions right.

https://observablehq.com/@hrbrmstr/2023-day-4-scratchcards?collection=@hrbrmstr/2023-advent-of-code

hrbrmstr, to javascript
@hrbrmstr@mastodon.social avatar

The “grid search" days of are tedious beasts, but here's a solve in both and in the same notebook: https://observablehq.com/@hrbrmstr/2023-day-3-gear-ratios?collection=@hrbrmstr/2023-advent-of-code

Tried to stay ecosystem idiomatic for both R and JS bits.

Quarto version coming in a bit.

  • All
  • Subscribed
  • Moderated
  • Favorites
  • JUstTest
  • GTA5RPClips
  • DreamBathrooms
  • InstantRegret
  • magazineikmin
  • osvaldo12
  • Youngstown
  • ngwrru68w68
  • slotface
  • everett
  • rosin
  • thenastyranch
  • kavyap
  • tacticalgear
  • megavids
  • modclub
  • normalnudes
  • cubers
  • ethstaker
  • mdbf
  • Durango
  • khanakhh
  • tester
  • provamag3
  • cisconetworking
  • Leos
  • anitta
  • lostlight
  • All magazines