{"id":13569,"date":"2022-09-09T19:45:31","date_gmt":"2022-09-10T00:45:31","guid":{"rendered":"https:\/\/rud.is\/b\/?p=13569"},"modified":"2022-09-09T19:45:31","modified_gmt":"2022-09-10T00:45:31","slug":"fall-foliage-javascript-ojs-edition","status":"publish","type":"post","link":"https:\/\/rud.is\/b\/2022\/09\/09\/fall-foliage-javascript-ojs-edition\/","title":{"rendered":"Fall Foliage: JavaScript\/OJS Edition"},"content":{"rendered":"<p>I&#8217;ve been (mostly) keeping up with annual updates for my <a href=\"https:\/\/rud.is\/b\/2017\/09\/18\/mapping-fall-foliage-with-sf\/\">R\/{sf} U.S. foliage post<\/a> which you can find <a href=\"github.com\/hrbrmstr\/foliage\">on GH<\/a>. This year, we have <a href=\"https:\/\/quarto.org\/\">Quarto<\/a>, and it comes with so many batteries included that you&#8217;d think it was Christmas. One of those batteries is full support for the <a href=\"https:\/\/github.com\/observablehq\/runtime\">Observable runtime<\/a>. These are used in <code>{ojs}<\/code> Quarto blocks, and rendered versions can run anywhere.<\/p>\n<p>The Observable platform is great for both tinkering and publishing (we&#8217;re using it at work for some quick or experimental vis work), and with a few of the recent posts, here, showing how to turn Observable notebooks into Quarto documents, you&#8217;re literally two clicks or one command line away from using any public Observable notebook right in Quarto.<\/p>\n<p>I made a version of the foliage vis <a href=\"https:\/\/observablehq.com\/@hrbrmstr\/conus-foliage-2022\">in Observable<\/a> and then did the qmd conversion using the Chrome extension, tweaked the source a bit and published the same <a href=\"https:\/\/github.com\/hrbrmstr\/conus-foliage-2022\">in Quarto<\/a>.<\/p>\n<p>The interactive datavis uses some foundational Observable\/D3 libraries:<\/p>\n<ul>\n<li><a href=\"https:\/\/observablehq.com\/@d3\/choropleth\">d3\/choropleth<\/a>: for making the choropleth map<\/li>\n<li><a href=\"https:\/\/observablehq.com\/@mbostock\/scrubber\">mbostock\/scrubber<\/a>: for making the slider\/play control<\/li>\n<li><a href=\"https:\/\/observablehq.com\/@d3\/color-legend\">d3\/color-legend<\/a>: for displaying a color swatch legend<\/li>\n<\/ul>\n<p>In the JS code we set some datavis-centric values:<\/p>\n<pre><code class=\"language-javascript\">foliage_levels = [0.01, 0.1, 0.2, 0.3, 0.4, 0.5, 0.6]\nfoliage_colors = [\"#83A87C\", \"#FCF6B4\", \"#FDCC5C\", \"#F68C3F\", \"#EF3C23\", \"#BD1F29\", \"#98371F\"]\nfoliage_labels = [\"No Change\", \"Minimal\", \"Patchy\", \"Partial\", \"Near Peak\", \"Peak\", \"Past Peak\"]\nweek_label = [\"Sept 5th\", \"Sept 12th\", \"Sept 19th\", \"Sept 26th\", \"Oct 3rd\", \"Oct 10th\", \"Oct 17th\", \"Oct 24th\", \"Oct 31st\", \"Nov 7th\", \"Nov 14th\", \"Nov 21st\"]\n<\/code><\/pre>\n<p>We then borrow the U.S. Albers-projected topojson file from the <code>Choropleth<\/code> example notebook and rebuild the outline mesh and county geometry collections, since we need to get rid of Alaska and Hawaii (they&#8217;re not present in the source data). We do this by filtering out two FIPS codes:<\/p>\n<pre><code class=\"language-javascript\">counties = {\n  var cty = topojson.feature(us, us.objects.counties);\n  cty.features = cty.features.filter(\n    (d) =&gt; (d.id.substr(0, 2) != \"02\") &amp; (d.id.substr(0, 2) != \"15\")\n  );\n  return cty;\n}\n<\/code><\/pre>\n<p>I also ended up modifying the source CSV a bit to account for missing counties.<\/p>\n<p>After that, it was a straightforward call to our imported <code>Choropleth<\/code> function:<\/p>\n<pre><code class=\"language-javascript\">chart = Choropleth(rendered2022, {\n  id: (d) =&gt; d.id.toString().padStart(5, \"0\"), \/\/ this is needed since the CSV id column is numeric\n  value: (d) =&gt; d[week_label.indexOf(week) + 1], \/\/ this gets the foliage value based on which index the selected week is at\n  scale: d3.scaleLinear, \/\/ this says to map foliage_levels to foliage_colors directly\n  domain: foliage_levels,\n  range: foliage_colors,\n  title: (f, d) =&gt;\n    `${f.properties.name}, ${statemap.get(f.id.slice(0, 2)).properties.name}`, \/\/ this makes the county hover text the county + state names\n  features: counties, \/\/ this is the counties we modified\n  borders: statemesh, \/\/ this is the statemesh\n  width: 975,\n  height: 610\n})\n<\/code><\/pre>\n<p>and placing the legend and scrubbing slider.<\/p>\n<p>The only real difference between the notebook and qmd is the inclusion of the source functions rather than use Observable&#8217;s <code>import<\/code> (I&#8217;ve found that there&#8217;s a slight load delay for <code>import<\/code>s when network conditions aren&#8217;t super perfect and the inclusion of the source \u2014 WITH copyrights \u2014\u00a0makes up for that).<\/p>\n<p>I&#8217;ve set up the Quarto project so that renders go to the <code>docs\/<\/code> directory, which makes it easy to publish as a GH page.<\/p>\n<h3>FIN<\/h3>\n<p>Drop issues on GH if anything needs clarifying or fixing and go experiment! You can&#8217;t break anything either on Observable or locally that version control can&#8217;t fix (yes, Observable has version control!).<\/p>\n<p>Some things to consider modifying\/adding:<\/p>\n<ul>\n<li>have a click take you to a (selectable?) mapping service, so folks can get driving directions<\/li>\n<li>turn the hover text into a proper tooltip<\/li>\n<li>speed up or slow down the animation when &#8216;Play&#8217; is tapped<\/li>\n<li>use different colors<\/li>\n<li>bring in older datasets (see the <code>foliage<\/code> GH repo) and make multiple maps or let the user select them or have them compare across years<\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"<p>I&#8217;ve been (mostly) keeping up with annual updates for my R\/{sf} U.S. foliage post which you can find on GH. This year, we have Quarto, and it comes with so many batteries included that you&#8217;d think it was Christmas. One of those batteries is full support for the Observable runtime. These are used in {ojs} [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":13572,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"activitypub_content_warning":"","activitypub_content_visibility":"","activitypub_max_image_attachments":3,"activitypub_interaction_policy_quote":"anyone","activitypub_status":"","footnotes":""},"categories":[666,15,842,860],"tags":[],"class_list":["post-13569","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-d3","category-javascript","category-observable","category-quarto"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.3 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Fall Foliage: JavaScript\/OJS Edition - rud.is<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/rud.is\/b\/2022\/09\/09\/fall-foliage-javascript-ojs-edition\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Fall Foliage: JavaScript\/OJS Edition - rud.is\" \/>\n<meta property=\"og:description\" content=\"I&#8217;ve been (mostly) keeping up with annual updates for my R\/{sf} U.S. foliage post which you can find on GH. This year, we have Quarto, and it comes with so many batteries included that you&#8217;d think it was Christmas. One of those batteries is full support for the Observable runtime. These are used in {ojs} [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/rud.is\/b\/2022\/09\/09\/fall-foliage-javascript-ojs-edition\/\" \/>\n<meta property=\"og:site_name\" content=\"rud.is\" \/>\n<meta property=\"article:published_time\" content=\"2022-09-10T00:45:31+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/i0.wp.com\/rud.is\/b\/wp-content\/uploads\/2022\/09\/foliage.png?fit=1592%2C1380&ssl=1\" \/>\n\t<meta property=\"og:image:width\" content=\"1592\" \/>\n\t<meta property=\"og:image:height\" content=\"1380\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"hrbrmstr\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"hrbrmstr\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"3 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/rud.is\\\/b\\\/2022\\\/09\\\/09\\\/fall-foliage-javascript-ojs-edition\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/rud.is\\\/b\\\/2022\\\/09\\\/09\\\/fall-foliage-javascript-ojs-edition\\\/\"},\"author\":{\"name\":\"hrbrmstr\",\"@id\":\"https:\\\/\\\/rud.is\\\/b\\\/#\\\/schema\\\/person\\\/d7cb7487ab0527447f7fda5c423ff886\"},\"headline\":\"Fall Foliage: JavaScript\\\/OJS Edition\",\"datePublished\":\"2022-09-10T00:45:31+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/rud.is\\\/b\\\/2022\\\/09\\\/09\\\/fall-foliage-javascript-ojs-edition\\\/\"},\"wordCount\":464,\"commentCount\":1,\"publisher\":{\"@id\":\"https:\\\/\\\/rud.is\\\/b\\\/#\\\/schema\\\/person\\\/d7cb7487ab0527447f7fda5c423ff886\"},\"image\":{\"@id\":\"https:\\\/\\\/rud.is\\\/b\\\/2022\\\/09\\\/09\\\/fall-foliage-javascript-ojs-edition\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/i0.wp.com\\\/rud.is\\\/b\\\/wp-content\\\/uploads\\\/2022\\\/09\\\/foliage.png?fit=1592%2C1380&ssl=1\",\"articleSection\":[\"d3\",\"Javascript\",\"Observable\",\"Quarto\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/rud.is\\\/b\\\/2022\\\/09\\\/09\\\/fall-foliage-javascript-ojs-edition\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/rud.is\\\/b\\\/2022\\\/09\\\/09\\\/fall-foliage-javascript-ojs-edition\\\/\",\"url\":\"https:\\\/\\\/rud.is\\\/b\\\/2022\\\/09\\\/09\\\/fall-foliage-javascript-ojs-edition\\\/\",\"name\":\"Fall Foliage: JavaScript\\\/OJS Edition - rud.is\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/rud.is\\\/b\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/rud.is\\\/b\\\/2022\\\/09\\\/09\\\/fall-foliage-javascript-ojs-edition\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/rud.is\\\/b\\\/2022\\\/09\\\/09\\\/fall-foliage-javascript-ojs-edition\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/i0.wp.com\\\/rud.is\\\/b\\\/wp-content\\\/uploads\\\/2022\\\/09\\\/foliage.png?fit=1592%2C1380&ssl=1\",\"datePublished\":\"2022-09-10T00:45:31+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/rud.is\\\/b\\\/2022\\\/09\\\/09\\\/fall-foliage-javascript-ojs-edition\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/rud.is\\\/b\\\/2022\\\/09\\\/09\\\/fall-foliage-javascript-ojs-edition\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/rud.is\\\/b\\\/2022\\\/09\\\/09\\\/fall-foliage-javascript-ojs-edition\\\/#primaryimage\",\"url\":\"https:\\\/\\\/i0.wp.com\\\/rud.is\\\/b\\\/wp-content\\\/uploads\\\/2022\\\/09\\\/foliage.png?fit=1592%2C1380&ssl=1\",\"contentUrl\":\"https:\\\/\\\/i0.wp.com\\\/rud.is\\\/b\\\/wp-content\\\/uploads\\\/2022\\\/09\\\/foliage.png?fit=1592%2C1380&ssl=1\",\"width\":1592,\"height\":1380,\"caption\":\"foliage map\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/rud.is\\\/b\\\/2022\\\/09\\\/09\\\/fall-foliage-javascript-ojs-edition\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/rud.is\\\/b\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Fall Foliage: JavaScript\\\/OJS Edition\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/rud.is\\\/b\\\/#website\",\"url\":\"https:\\\/\\\/rud.is\\\/b\\\/\",\"name\":\"rud.is\",\"description\":\"&quot;In God we trust. All others must bring data&quot;\",\"publisher\":{\"@id\":\"https:\\\/\\\/rud.is\\\/b\\\/#\\\/schema\\\/person\\\/d7cb7487ab0527447f7fda5c423ff886\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/rud.is\\\/b\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":[\"Person\",\"Organization\"],\"@id\":\"https:\\\/\\\/rud.is\\\/b\\\/#\\\/schema\\\/person\\\/d7cb7487ab0527447f7fda5c423ff886\",\"name\":\"hrbrmstr\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/i0.wp.com\\\/rud.is\\\/b\\\/wp-content\\\/uploads\\\/2023\\\/10\\\/ukr-shield.png?fit=460%2C460&ssl=1\",\"url\":\"https:\\\/\\\/i0.wp.com\\\/rud.is\\\/b\\\/wp-content\\\/uploads\\\/2023\\\/10\\\/ukr-shield.png?fit=460%2C460&ssl=1\",\"contentUrl\":\"https:\\\/\\\/i0.wp.com\\\/rud.is\\\/b\\\/wp-content\\\/uploads\\\/2023\\\/10\\\/ukr-shield.png?fit=460%2C460&ssl=1\",\"width\":460,\"height\":460,\"caption\":\"hrbrmstr\"},\"logo\":{\"@id\":\"https:\\\/\\\/i0.wp.com\\\/rud.is\\\/b\\\/wp-content\\\/uploads\\\/2023\\\/10\\\/ukr-shield.png?fit=460%2C460&ssl=1\"},\"description\":\"Don't look at me\u2026I do what he does \u2014 just slower. #rstats avuncular \u2022 ?Resistance Fighter \u2022 Cook \u2022 Christian \u2022 [Master] Chef des Donn\u00e9es de S\u00e9curit\u00e9 @ @rapid7\",\"sameAs\":[\"http:\\\/\\\/rud.is\"],\"url\":\"https:\\\/\\\/rud.is\\\/b\\\/author\\\/hrbrmstr\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Fall Foliage: JavaScript\/OJS Edition - rud.is","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/rud.is\/b\/2022\/09\/09\/fall-foliage-javascript-ojs-edition\/","og_locale":"en_US","og_type":"article","og_title":"Fall Foliage: JavaScript\/OJS Edition - rud.is","og_description":"I&#8217;ve been (mostly) keeping up with annual updates for my R\/{sf} U.S. foliage post which you can find on GH. This year, we have Quarto, and it comes with so many batteries included that you&#8217;d think it was Christmas. One of those batteries is full support for the Observable runtime. These are used in {ojs} [&hellip;]","og_url":"https:\/\/rud.is\/b\/2022\/09\/09\/fall-foliage-javascript-ojs-edition\/","og_site_name":"rud.is","article_published_time":"2022-09-10T00:45:31+00:00","og_image":[{"width":1592,"height":1380,"url":"https:\/\/i0.wp.com\/rud.is\/b\/wp-content\/uploads\/2022\/09\/foliage.png?fit=1592%2C1380&ssl=1","type":"image\/png"}],"author":"hrbrmstr","twitter_card":"summary_large_image","twitter_misc":{"Written by":"hrbrmstr","Est. reading time":"3 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/rud.is\/b\/2022\/09\/09\/fall-foliage-javascript-ojs-edition\/#article","isPartOf":{"@id":"https:\/\/rud.is\/b\/2022\/09\/09\/fall-foliage-javascript-ojs-edition\/"},"author":{"name":"hrbrmstr","@id":"https:\/\/rud.is\/b\/#\/schema\/person\/d7cb7487ab0527447f7fda5c423ff886"},"headline":"Fall Foliage: JavaScript\/OJS Edition","datePublished":"2022-09-10T00:45:31+00:00","mainEntityOfPage":{"@id":"https:\/\/rud.is\/b\/2022\/09\/09\/fall-foliage-javascript-ojs-edition\/"},"wordCount":464,"commentCount":1,"publisher":{"@id":"https:\/\/rud.is\/b\/#\/schema\/person\/d7cb7487ab0527447f7fda5c423ff886"},"image":{"@id":"https:\/\/rud.is\/b\/2022\/09\/09\/fall-foliage-javascript-ojs-edition\/#primaryimage"},"thumbnailUrl":"https:\/\/i0.wp.com\/rud.is\/b\/wp-content\/uploads\/2022\/09\/foliage.png?fit=1592%2C1380&ssl=1","articleSection":["d3","Javascript","Observable","Quarto"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/rud.is\/b\/2022\/09\/09\/fall-foliage-javascript-ojs-edition\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/rud.is\/b\/2022\/09\/09\/fall-foliage-javascript-ojs-edition\/","url":"https:\/\/rud.is\/b\/2022\/09\/09\/fall-foliage-javascript-ojs-edition\/","name":"Fall Foliage: JavaScript\/OJS Edition - rud.is","isPartOf":{"@id":"https:\/\/rud.is\/b\/#website"},"primaryImageOfPage":{"@id":"https:\/\/rud.is\/b\/2022\/09\/09\/fall-foliage-javascript-ojs-edition\/#primaryimage"},"image":{"@id":"https:\/\/rud.is\/b\/2022\/09\/09\/fall-foliage-javascript-ojs-edition\/#primaryimage"},"thumbnailUrl":"https:\/\/i0.wp.com\/rud.is\/b\/wp-content\/uploads\/2022\/09\/foliage.png?fit=1592%2C1380&ssl=1","datePublished":"2022-09-10T00:45:31+00:00","breadcrumb":{"@id":"https:\/\/rud.is\/b\/2022\/09\/09\/fall-foliage-javascript-ojs-edition\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/rud.is\/b\/2022\/09\/09\/fall-foliage-javascript-ojs-edition\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/rud.is\/b\/2022\/09\/09\/fall-foliage-javascript-ojs-edition\/#primaryimage","url":"https:\/\/i0.wp.com\/rud.is\/b\/wp-content\/uploads\/2022\/09\/foliage.png?fit=1592%2C1380&ssl=1","contentUrl":"https:\/\/i0.wp.com\/rud.is\/b\/wp-content\/uploads\/2022\/09\/foliage.png?fit=1592%2C1380&ssl=1","width":1592,"height":1380,"caption":"foliage map"},{"@type":"BreadcrumbList","@id":"https:\/\/rud.is\/b\/2022\/09\/09\/fall-foliage-javascript-ojs-edition\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/rud.is\/b\/"},{"@type":"ListItem","position":2,"name":"Fall Foliage: JavaScript\/OJS Edition"}]},{"@type":"WebSite","@id":"https:\/\/rud.is\/b\/#website","url":"https:\/\/rud.is\/b\/","name":"rud.is","description":"&quot;In God we trust. All others must bring data&quot;","publisher":{"@id":"https:\/\/rud.is\/b\/#\/schema\/person\/d7cb7487ab0527447f7fda5c423ff886"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/rud.is\/b\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":["Person","Organization"],"@id":"https:\/\/rud.is\/b\/#\/schema\/person\/d7cb7487ab0527447f7fda5c423ff886","name":"hrbrmstr","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/i0.wp.com\/rud.is\/b\/wp-content\/uploads\/2023\/10\/ukr-shield.png?fit=460%2C460&ssl=1","url":"https:\/\/i0.wp.com\/rud.is\/b\/wp-content\/uploads\/2023\/10\/ukr-shield.png?fit=460%2C460&ssl=1","contentUrl":"https:\/\/i0.wp.com\/rud.is\/b\/wp-content\/uploads\/2023\/10\/ukr-shield.png?fit=460%2C460&ssl=1","width":460,"height":460,"caption":"hrbrmstr"},"logo":{"@id":"https:\/\/i0.wp.com\/rud.is\/b\/wp-content\/uploads\/2023\/10\/ukr-shield.png?fit=460%2C460&ssl=1"},"description":"Don't look at me\u2026I do what he does \u2014 just slower. #rstats avuncular \u2022 ?Resistance Fighter \u2022 Cook \u2022 Christian \u2022 [Master] Chef des Donn\u00e9es de S\u00e9curit\u00e9 @ @rapid7","sameAs":["http:\/\/rud.is"],"url":"https:\/\/rud.is\/b\/author\/hrbrmstr\/"}]}},"jetpack_featured_media_url":"https:\/\/i0.wp.com\/rud.is\/b\/wp-content\/uploads\/2022\/09\/foliage.png?fit=1592%2C1380&ssl=1","jetpack_shortlink":"https:\/\/wp.me\/p23idr-3wR","jetpack_likes_enabled":true,"jetpack-related-posts":[{"id":14337,"url":"https:\/\/rud.is\/b\/2023\/09\/09\/foliage-2023\/","url_meta":{"origin":13569,"position":0},"title":"Foliage 2023","author":"hrbrmstr","date":"2023-09-09","format":false,"excerpt":"2023-09-10 UPDATE: Art Steinmetz took me up on the Shiny challenge (at the end of the post) and did a fantastic job! The days are getting shorter and when we were visiting Down East Maine the other week, there was just a hint of some trees starting to change up\u2026","rel":"","context":"In &quot;data wrangling&quot;","block_context":{"text":"data wrangling","link":"https:\/\/rud.is\/b\/category\/data-wrangling\/"},"img":{"alt_text":"conus foliage map 2023","src":"https:\/\/i0.wp.com\/rud.is\/b\/wp-content\/uploads\/2023\/09\/lit-plot.png?fit=1200%2C1137&ssl=1&resize=350%2C200","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/rud.is\/b\/wp-content\/uploads\/2023\/09\/lit-plot.png?fit=1200%2C1137&ssl=1&resize=350%2C200 1x, https:\/\/i0.wp.com\/rud.is\/b\/wp-content\/uploads\/2023\/09\/lit-plot.png?fit=1200%2C1137&ssl=1&resize=525%2C300 1.5x, https:\/\/i0.wp.com\/rud.is\/b\/wp-content\/uploads\/2023\/09\/lit-plot.png?fit=1200%2C1137&ssl=1&resize=700%2C400 2x, https:\/\/i0.wp.com\/rud.is\/b\/wp-content\/uploads\/2023\/09\/lit-plot.png?fit=1200%2C1137&ssl=1&resize=1050%2C600 3x"},"classes":[]},{"id":13533,"url":"https:\/\/rud.is\/b\/2022\/08\/19\/bootstrapping-an-ojs-quarto-document-with-an-observable-notebook\/","url_meta":{"origin":13569,"position":1},"title":"Bootstrapping An {ojs} Quarto Document With An Observable Notebook","author":"hrbrmstr","date":"2022-08-19","format":false,"excerpt":"Quarto is amazing! And, it's eating the world! OK. Perhaps not the entire world. But it's still amazing! If you browse around the HQ, you'll find many interesting notebooks. You may even have a few yourself! Wouldn't it be great if you could just import an Observable notebook right into\u2026","rel":"","context":"In &quot;Quarto&quot;","block_context":{"text":"Quarto","link":"https:\/\/rud.is\/b\/category\/quarto\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":13549,"url":"https:\/\/rud.is\/b\/2022\/08\/20\/ohq2quarto-rust-based-cli-for-turning-observable-notebooks-into-quarto-projects\/","url_meta":{"origin":13569,"position":2},"title":"ohq2quarto \u2014 Rust-Based CLI For Turning Observable Notebooks Into Quarto Projects","author":"hrbrmstr","date":"2022-08-20","format":false,"excerpt":"The previous post had some hacky R code to grab seekrit JSON data in ObservableHQ (OHQ) Notebooks and spit out a directory with a Quarto qmd and any associated FileAttachments. Holding firm to my \"no more generic public R packages\" decree, that's as far as the R code for that\u2026","rel":"","context":"In &quot;Quarto&quot;","block_context":{"text":"Quarto","link":"https:\/\/rud.is\/b\/category\/quarto\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":14001,"url":"https:\/\/rud.is\/b\/2023\/04\/29\/supreme-annotations-plot-redux-an-ojs-plot%e2%86%94ggplot2-rosetta-stone\/","url_meta":{"origin":13569,"position":3},"title":"Supreme Annotations Plot Redux &#038; An OJS Plot\u2194ggplot2 Rosetta Stone","author":"hrbrmstr","date":"2023-04-29","format":false,"excerpt":"Back in 2016, I did a post on {ggplot2} text annotations because it was a tad more challenging to do some of the things in that post back in the day. Since I've been moving back and forth between R and Observable (and JavaScript in general), I decided to recreate\u2026","rel":"","context":"In &quot;Observable&quot;","block_context":{"text":"Observable","link":"https:\/\/rud.is\/b\/category\/observable\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":13554,"url":"https:\/\/rud.is\/b\/2022\/08\/22\/new-chrome-extension-to-turn-observable-notebooks-into-quarto-projects\/","url_meta":{"origin":13569,"position":4},"title":"New Chrome Extension To Turn Observable Notebooks Into Quarto Projects","author":"hrbrmstr","date":"2022-08-22","format":false,"excerpt":"My previous post announced a Rust-based command line tool for generating Quarto projects from Observable Notebooks. Some folks may not want to use yet-another command line tool, and it dawned on me that it'd be more convenient to just do the conversion in-browser when one is already on a Notebook\u2026","rel":"","context":"In &quot;Chrome&quot;","block_context":{"text":"Chrome","link":"https:\/\/rud.is\/b\/category\/chrome\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":13069,"url":"https:\/\/rud.is\/b\/2021\/05\/09\/using-the-new-plot-javascript-exploratory-visualization-library-sans-observable\/","url_meta":{"origin":13569,"position":5},"title":"Using the new Plot Javascript Exploratory Visualization Library Sans-Observable","author":"hrbrmstr","date":"2021-05-09","format":false,"excerpt":"The fine folks over at @ObservableHQ released a new javascript exploratory visualization library called Plot last week with great fanfare. It was primarily designed to be used in Observable notebooks and I quickly tested it out there (you can find them at my Observable landing page: https:\/\/observablehq.com\/@hrbrmstr). {Plot} doesn't require\u2026","rel":"","context":"In &quot;d3&quot;","block_context":{"text":"d3","link":"https:\/\/rud.is\/b\/category\/d3\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]}],"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/rud.is\/b\/wp-json\/wp\/v2\/posts\/13569","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/rud.is\/b\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/rud.is\/b\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/rud.is\/b\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/rud.is\/b\/wp-json\/wp\/v2\/comments?post=13569"}],"version-history":[{"count":0,"href":"https:\/\/rud.is\/b\/wp-json\/wp\/v2\/posts\/13569\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/rud.is\/b\/wp-json\/wp\/v2\/media\/13572"}],"wp:attachment":[{"href":"https:\/\/rud.is\/b\/wp-json\/wp\/v2\/media?parent=13569"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/rud.is\/b\/wp-json\/wp\/v2\/categories?post=13569"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/rud.is\/b\/wp-json\/wp\/v2\/tags?post=13569"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}