mdv - GitLite

KO | EN

gitlite — search

#python #hacktoberfest #react #ai #android #deep-learning #linux #docker #macos #java #cli #awesome-list #security #ios

mdv

(★ 502)

MDV — a Markdown superset for documents, dashboards, and slides with embedded data and visualizations. HTML + PDF export, live preview, VS Code extension.

파일 탐색기

최종 버전 다운로드 (.zip)

- - ci.yml
  - pages.yml
  - release-vscode-extension.yml
- CODEOWNERS
- dependabot.yml
- pull_request_template.md
- charts.md
- cli.md
- data.md
- getting-started.md
- publishing-vscode-extension.md
- README.md
- syntax.md
- themes-and-styles.md
- vscode.md
- - sales.csv
- - 01-plain-markdown.html
  - 02-named-style.html
  - 03-bar-chart-inline.html
  - 04-line-chart-inline.html
  - 05-pie-chart-inline.html
  - 06-table.html
  - 07-data-file-ref.html
  - 08-columns-layout.html
  - 09-full-report.html
  - 09-full-report.pdf
  - 10-new-features.html
  - 10-new-features.pdf
- 01-plain-markdown.mdv
- 02-named-style.mdv
- 03-bar-chart-inline.mdv
- 04-line-chart-inline.mdv
- 05-pie-chart-inline.mdv
- 06-table.mdv
- 07-data-file-ref.mdv
- 08-columns-layout.mdv
- 09-full-report.mdv
- 10-new-features.mdv
- - package.json
  - tsconfig.json
- - package.json
  - tsconfig.json
- - .vscodeignore
  - CHANGELOG.md
  - esbuild.config.mjs
  - language-configuration.json
  - LICENSE
  - package.json
  - README.md
  - tsconfig.json
- - index-body.html
  - shell.html
  - site.css
- build-site.mjs
.editorconfig
.gitignore
CHANGELOG.md
CLAUDE.md
LICENSE
package-lock.json
package.json
README.md
tsconfig.base.json

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

# MDV — Markdown Data & Visualization

> Write reports, dashboards, and slide decks in a single Markdown-native workflow, then export to self-contained HTML or PDF — no rebuilding the same content across a doc tool, a BI tool, and a deck tool.

Charts, KPI cards, tables, and styled regions come from nothing more complicated than fenced code blocks and named styles. `.mdv` is **strict CommonMark plus four additions**:

1. **YAML front-matter** for title, theme, named styles, and dataset references.
2. **Fenced blocks** for data/visuals: `` ```chart type=bar x=region y=sales ``.
3. **`:::` containers** for styled regions and layout: `::: callout` / `::: columns`.
4. **`:::` `toc`** for an auto-generated table of contents.

No selectors, no classes, no expressions, no code. Themes provide defaults, named styles give reusable looks, the renderer does the rest.

## Quick look

````markdown
---
title: Q1 Report
theme: report
data:
  sales: ./data/sales.csv
---

::: toc
:::

# Q1 Results

```stat
label, value, delta
Total revenue, $2.06M, +14%
New customers, 1238, +8%
```

```chart type=line data=sales x=month y=revenue series=region yFormat=currency title="Monthly revenue"
```
````

Renders to self-contained HTML (charts are inline SVG, no JS runtime) and PDF. Lives inside VS Code via a side-by-side preview.

## Getting started

```bash
git clone <repo> mdv
cd mdv
npm install
npm run build

# Render an example
node packages/mdv-cli/dist/index.js render examples/09-full-report.mdv

# Or: live preview with auto-reload
node packages/mdv-cli/dist/index.js preview examples/09-full-report.mdv
```

See [docs/getting-started.md](docs/getting-started.md) for a walkthrough.

## Documentation

- [Getting started](docs/getting-started.md) — install, author your first file, see it rendered.
- [Syntax reference](docs/syntax.md) — front-matter, fenced blocks, `:::` containers.
- [Charts & stats](docs/charts.md) — every visualization type with all options.
- [Data](docs/data.md) — inline CSV / JSON / file-referenced datasets.
- [Themes & styles](docs/themes-and-styles.md) — built-in themes and how to define named styles.
- [CLI](docs/cli.md) — `render`, `preview`, `export --pdf`.
- [VS Code extension](docs/vscode.md) — side-by-side live preview.
- [Publishing the VS Code extension](docs/publishing-vscode-extension.md) — Marketplace workflow.

## Examples

[`examples/`](examples) contains 10 sample files covering every feature. Rendered HTML is in [`examples/out/`](examples/out).

## Status