d3.csvParse
mdTableRendered = md`${mdTable}`
md`${mdTable}`
penguins
md`## Usage in Observable
~~~js
import {dataToMarkdown} from "@john-guerra/csv-to-markdown-table""
~~~
and then
~~~js
mdTable = dataToMarkdown(yourData)
~~~
`
data.slice(0,1)
{
const columns = Object.keys(data[0]);
const lengths = columns.map(c => d3.max(data.map(d => d[c].toString().length).concat(c.length)));
return lengths
}
mdTable
async function dataToMarkdown(data) {
if (!Array.isArray(data) || data.length < 0)
throw "Please provide an array with elements";
let markup;
const columns = Object.keys(data[0]);
const lengths = columns.map((c) =>
d3.max(
data.map((d) => (d[c] ? d[c].toString().length : 4)).concat(c.length)
)
);
markup = `| ${columns
.map((c, i) => c.padEnd(lengths[i], " "))
.join(" | ")} | `;
markup = markup.concat(
`\n| ${columns.map((c, i) => "-".repeat(lengths[i])).join(" | ")} | `
);
data.forEach(
(d) =>
(markup = markup.concat(
`\n| ${columns
.map((c, i) => (d[c] ? d[c].toString() : "null").padEnd(lengths[i]))
.join(" | ")} | `
))
);
return markup;
}
import {dataInput} from "@john-guerra/file-input-with-default-value"
data
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
