diff --git a/documents/ojs-linked/index.qmd b/documents/ojs-linked/index.qmd index 4a20ba5..e375847 100644 --- a/documents/ojs-linked/index.qmd +++ b/documents/ojs-linked/index.qmd @@ -7,7 +7,6 @@ date: last-modified date-format: "DD-MMM-YYYY" format: html: - theme: materia fig-align: left title-block-banner: true code-tools: true diff --git a/documents/ojs-plots/index.qmd b/documents/ojs-plots/index.qmd index 2b51420..0fbb272 100644 --- a/documents/ojs-plots/index.qmd +++ b/documents/ojs-plots/index.qmd @@ -6,7 +6,7 @@ date: last-modified date-format: "DD-MMM-YYYY" format: html: - theme: materia + page-layout: full fig-align: left title-block-banner: true code-tools: true @@ -55,8 +55,8 @@ viewof tbl_mtcars = Inputs.table(mtcars) ```{r} #| filename: R -ggplot(mtcars, aes(wt, mpg, label = rownames(mtcars))) + - geom_text(nudge_x = 0.05) +ggplot(mtcars, aes(wt, mpg, col = cyl)) + + geom_point() ``` ::: @@ -66,53 +66,20 @@ ggplot(mtcars, aes(wt, mpg, label = rownames(mtcars))) + ```{ojs} //| filename: OJS -Plot.plot({ +plot_data = Plot.plot({ + color: { legend: true}, marks: [ - Plot.text( - mtcars, - { x: "wt", y: "mpg", text: "vehicle", textAnchor: "start" } - ) + Plot.dot(mtcars, { + x: "wt", + y: "mpg", + fill: "cyl", + tip: true, + channels: { Name: "_row" } + }) ], grid: true }) -``` -::: -::: - - -### With categorical colors - -::: {.grid} -::: {.g-col-6} - -```{r} -#| filename: R - -ggplot(mtcars, aes(wt, mpg, label = rownames(mtcars))) + - geom_text(aes(colour = factor(cyl))) -``` -::: - -::: {.g-col-6} - -```{ojs} -//| filename: OJS - -Plot.plot({ - color: { - type: "ordinal", - range: [ "#88a2bc", "#d99477", "#586c5c"], - legend: true - }, - marks: [ - Plot.text( - mtcars.map(d => { d.cyl = `${d.cyl}`; return d }), - { x: "wt", y: "mpg", text: "vehicle", fill: "cyl" } - ) - ], - grid: true -}) ``` ::: ::: diff --git a/documents/ojs-widgets/index.qmd b/documents/ojs-widgets/index.qmd index 653e4c5..e40cd42 100644 --- a/documents/ojs-widgets/index.qmd +++ b/documents/ojs-widgets/index.qmd @@ -6,7 +6,6 @@ date: last-modified date-format: "DD-MMM-YYYY" format: html: - theme: materia fig-align: left title-block-banner: true toc: true @@ -277,10 +276,15 @@ function downloadHtmlAsImage(el, options) { } ``` +Download an image as PNG. + ```{ojs} downloadHtmlAsImage(barplot) ``` +Adjust the scale parameter. + + ```{ojs} downloadHtmlAsImage(barplot, { label: "Download 4X PNG", @@ -289,6 +293,17 @@ downloadHtmlAsImage(barplot, { }) ``` +Download image as SVG. + +```{ojs} +import {serialize} from "@mbostock/saving-svg" +import {rasterize} from "@mbostock/saving-svg" +``` + +```{ojs} +DOM.download(() => serialize(barplot), undefined, "Save as SVG") +``` + ### Zip download ```{ojs} diff --git a/documents/ojs/index.qmd b/documents/ojs/index.qmd index b3112d8..28e6d97 100644 --- a/documents/ojs/index.qmd +++ b/documents/ojs/index.qmd @@ -6,7 +6,6 @@ date: last-modified date-format: "DD-MMM-YYYY" format: html: - theme: materia fig-align: left title-block-banner: true code-tools: true diff --git a/documents/param-text/index.qmd b/documents/param-text/index.qmd index f7ec70d..1be158e 100644 --- a/documents/param-text/index.qmd +++ b/documents/param-text/index.qmd @@ -6,8 +6,6 @@ date: 08-Oct-2023 format: html: title-block-banner: true - theme: pulse - highlight: kate code-tools: true params: diff --git a/documents/report/index.qmd b/documents/report/index.qmd index afd4a57..69944ec 100644 --- a/documents/report/index.qmd +++ b/documents/report/index.qmd @@ -8,8 +8,6 @@ format: title-block-banner: true toc: true number-sections: true - theme: pulse - highlight: kate code-tools: true fig-align: left diff --git a/documents/shinylive/index.qmd b/documents/shinylive/index.qmd index 13db465..0420bbb 100644 --- a/documents/shinylive/index.qmd +++ b/documents/shinylive/index.qmd @@ -6,7 +6,6 @@ author: "Roy Francis" date: last-modified format: html: - theme: materia title-block-banner: true toc: true number-sections: true diff --git a/documents/theme-title/index.qmd b/documents/theme-title/index.qmd deleted file mode 100644 index 18804e6..0000000 --- a/documents/theme-title/index.qmd +++ /dev/null @@ -1,19 +0,0 @@ ---- -title: Testing theme title -date: 08-May-2023 -format: - revealjs ---- - -## Slide 1 - -Content - -## Theme - -Some more content - -## Bla - -More stuff here - diff --git a/documents/webr/index.qmd b/documents/webr/index.qmd index 0ce9047..f4f8946 100644 --- a/documents/webr/index.qmd +++ b/documents/webr/index.qmd @@ -6,7 +6,6 @@ date: last-modified date-format: "DD-MMM-YYYY" format: html: - theme: materia fig-align: left title-block-banner: true toc: true diff --git a/index.qmd b/index.qmd index bc6993b..1f64d21 100644 --- a/index.qmd +++ b/index.qmd @@ -8,26 +8,40 @@ format: --- ## Parameterized outputs -### [Parameterized html report](documents/report/index.qmd) -### [Parameterized html revealjs presentation](documents/revealjs/index.qmd) -### [Parameterized pdf](documents/pdf/index.pdf) -### [Parameterized html report from external file](documents/param-text/index.qmd) + +In parameterized reports, one or more parameters used in the document are provided to the document at the time of rendering. + +- [Parameterized html report](documents/report/index.qmd) +- [Parameterized html revealjs presentation](documents/revealjs/index.qmd) +- [Parameterized pdf](documents/pdf/index.pdf) +- [Parameterized html report from external file](documents/param-text/index.qmd) ## OJS -### [OJS and R](documents/ojs/index.qmd) -### [OJS widgets, upload and download](documents/ojs-widgets/index.qmd) -### [OJS and ggplot plots](documents/ojs-plots/index.qmd) -### [OJS linked plots](documents/ojs-linked/index.qmd) + +[Observable Plot](https://observablehq.github.io/plot/) is a javascript framework for exploratory data visualization. OJS is supported natively in quarto. Read more about OJS in quarto [here](https://quarto.org/docs/interactive/ojs/). + +- [OJS and R](documents/ojs/index.qmd) +- [OJS widgets, upload and download](documents/ojs-widgets/index.qmd) +- [OJS and ggplot plots](documents/ojs-plots/index.qmd) +- [OJS linked plots](documents/ojs-linked/index.qmd) ## WebR -### [WebR in HTML report using Quarto webr extension](documents/webr/index.qmd) -### [WebR in RevealJS presentation](documents/webr-revealjs/index.qmd) + +[WebR](https://docs.r-wasm.org/webr/latest/) allows to run R in the browser. Try out a [demo](https://webr.r-wasm.org/latest/) of R IDE running in the browser. R packages need to be specifically compiled for use with webr. He is the current list of [webr R packages](https://repo.r-wasm.org). + +- [WebR in HTML report using Quarto webr extension](documents/webr/index.qmd) +- [WebR in RevealJS presentation](documents/webr-revealjs/index.qmd) +- Intro to WebR & Shinylive by George Stagg: ## Shinylive -### [Shiny in the browser](documents/shinylive/index.qmd) + +Shinylive allows shiny applications to run in the browser wthout the need for a Shiny server. Shinylive is available for R and Python. + +- [Shiny app in the browser](documents/shinylive/index.qmd) ## Other -### [Icons in quarto](documents/icons/index.qmd) + +- [Icons in quarto](documents/icons/index.qmd)