https://github.com/brianpeiris/aframe-markdown

Render Markdown using SDF text in A-Frame.
https://github.com/brianpeiris/aframe-markdown

aframe markdown

Last synced: about 1 month ago
JSON representation

Render Markdown using SDF text in A-Frame.

• Host: GitHub
• URL: https://github.com/brianpeiris/aframe-markdown
• Owner: brianpeiris
• License: mit
• Created: 2018-12-12T06:39:43.000Z (almost 6 years ago)
• Default Branch: master
• Last Pushed: 2019-01-06T18:33:00.000Z (almost 6 years ago)
• Last Synced: 2024-09-17T03:16:28.891Z (2 months ago)
• Topics: aframe, markdown
• Language: JavaScript
• Homepage: https://brianpeiris.github.io/aframe-markdown/demos/
• Size: 16.6 MB
• Stars: 20
• Watchers: 3
• Forks: 4
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# aframe-markdown

[![](https://img.shields.io/npm/v/aframe-markdown.svg)](https://www.npmjs.com/package/aframe-markdown)

Renders Markdown using SDF text in A-Frame.

Demos: https://brianpeiris.github.io/aframe-markdown/demos/

Glitch: https://aframe-markdown.glitch.me/

![screen shot of basic demo](demos/basic-screenshot.jpg)

## Usage

```html

  

	

  

  

```

## Component Properties

|Properties|Description|Default|

|-|-|-|

|src|The source for the markdown to render. Either the actual markdown text, or a selector to an a-asset-item that loads the markdown||

|wrapCount|Number of characters before wrapping text (more or less).|40|

|padding|Padding in meters between the background and the text|0.05|

## System Properties

|Properties|Description|Default|

|-|-|-|

|normalFont|URL to the msdf.json file for the normal weight font||

|normalFont|URL to the msdf.json file for the bold font||

## Supported Markdown Features

aframe-markdown supports a basic subset of markdown.

- [x] Paragraphs

  - [x] Line breaks

- [x] Headers

- [x] Images

- [x] Lists

  - [x] Nested lists

  - [x] Unordered lists

  - [x] Ordered lists

- [ ] Inline bold and italic formatting

- [ ] Blockquotes

- [ ] Horizontal rules

- [ ] Tables

- [ ] Code

  - [ ] Inline code

  - [ ] Code blocks

- [ ] Links

## How it works

aframe-markdown uses a hidden div and marked.js to render the markdown in the background and then re-creates the 

rendered in a-frame using the HTML's metrics.