https://github.com/luiguild/aframe-svg-extruder

A-Frame component to extrude your SVG's files and use in WebVR scenes like magic 🌟
https://github.com/luiguild/aframe-svg-extruder

3d aframe aframe-component aframe-vr aframevr javascript svg svg-path virtual-reality virtualreality vr webvr

Last synced: 3 months ago
JSON representation

A-Frame component to extrude your SVG's files and use in WebVR scenes like magic 🌟

• Host: GitHub
• URL: https://github.com/luiguild/aframe-svg-extruder
• Owner: luiguild
• License: mit
• Created: 2018-06-12T23:20:52.000Z (over 6 years ago)
• Default Branch: develop
• Last Pushed: 2023-07-11T13:15:27.000Z (over 1 year ago)
• Last Synced: 2024-10-23T13:36:57.622Z (4 months ago)
• Topics: 3d, aframe, aframe-component, aframe-vr, aframevr, javascript, svg, svg-path, virtual-reality, virtualreality, vr, webvr
• Language: JavaScript
• Homepage: https://luiguild.github.io/aframe-svg-extruder/
• Size: 886 KB
• Stars: 71
• Watchers: 5
• Forks: 7
• Open Issues: 8
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

• vr-resources - aframe-svg-extruder, A-Frame component to extrude your SVG's files and use in WebVR scenes like mag

README

        
# aframe-svg-extruder

A-Frame component to extrude your SVG's files and use in WebVR scenes like magic 🌟



###### Demo

https://luiguild.github.io/aframe-svg-extruder/

## Usage

#### Development

``` bash

git clone https://github.com/luiguild/aframe-svg-extruder.git

npm install

npm start

```

#### Install

###### Using NPM

``` bash

npm i aframe-svg-extruder

```

###### Using yarn

``` bash

yarn add aframe-svg-extruder

```

###### Use via CDN

``` html

```

###### Add on your a-scene

``` html

  

  

  

  

  

  

  

```

## API

This is the list of the available parameters.

| Parameter | Type | Default | Required | Description |

| :--- | :--- | :--- | :--- | :--- |

| **src** | String | null | true | Pass the `path` of your SVG file |

| **proportionalScale** | Number | 1 | false | Proportionally how many times you want that your file grow |

| **extrude** | Number | 0.1 | false | The depth of the extrusion |

| **zFactor** | Number | 0.005 | false | This will help you control the z-fighting on complex SVG layouts |

| **overrideColor** | String | null | false | Set an `hex (eg: #000000)` color if you want override the original colors of file |



* kekab-case params for webcomponent |  camelCase for entity



## Help and contact

PRs are appreciated, issues are welcomed. For any question, ping @luiguild at aframevr in Slack, Twitter or Telegram.