https://github.com/mazfreelance/vue-winwheel

A vue component with winwheeljs for roulette and lucky spin. based on http://dougtesting.net/home
https://github.com/mazfreelance/vue-winwheel

Last synced: about 1 month ago
JSON representation

A vue component with winwheeljs for roulette and lucky spin. based on http://dougtesting.net/home

• Host: GitHub
• URL: https://github.com/mazfreelance/vue-winwheel
• Owner: mazfreelance
• Created: 2021-06-18T03:48:22.000Z (over 3 years ago)
• Default Branch: master
• Last Pushed: 2021-09-28T13:29:44.000Z (over 3 years ago)
• Last Synced: 2024-10-05T08:48:17.875Z (3 months ago)
• Language: JavaScript
• Homepage:
• Size: 506 KB
• Stars: 0
• Watchers: 1
• Forks: 1
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# vue-winwheel

a winwheel for vuejs based on http://dougtesting.net/home

fork on: https://github.com/rebotak/vue-winwheel

published on: https://www.npmjs.com/package/vue-winwheel

# Demo

Download this repository

```shell

git clone [email protected]:mazfreelance/vue-winwheel.git

```

Go to the demo folder

```shell

/vue-winwheel/demo

```

Then install dependencies

```shell

npm install

```

And run the project

```shell

npm run serve

```

# Installation

## npm

```shell

$ npm install vue-winwheel-reversion --save

```

# Usage

## Basic

```html

  

```

```html

import VueWinwheel from 'vue-winwheel-reversion/vue-winwheel'

export default {

  components:{

    VueWinwheel

  },

  data(){

    return{

	  pageTitle       : "Vue-Wheel",

      wheelSize       : 400,

      btnColor        : "",

      btnText         : "",

      lineWidth       : 3,

      duration        : 5,

      spin       	  : 5,

      options:[

					{

						textFillStyle: '#fff',

						fillStyle: '#000',

						text:'Prize 1'

					},

					{

						textFillStyle: '#000',

						fillStyle: '#fadede',

						text:'Prize 2'

					},

					{

						textFillStyle: '#fff',

						fillStyle: '#000',

						text:'Prize 3'

					},

					{

						textFillStyle: '#000',

						fillStyle: '#fadede',

						text:'Prize 4'

					},

					{

						textFillStyle: '#fff',

						fillStyle: '#000',

						text:'Prize 5'

					},

					{

						textFillStyle: '#000',

						fillStyle: '#fadede',

						text:'Prize 6'

					},

					{

						textFillStyle: '#fff',

						fillStyle: '#000',

						text:'Prize 7'

					},

					{

						textFillStyle: '#000',

						fillStyle: '#fadede',

						text:'Prize 8'

					}

				]

    }

  }

}

```

# License

[The MIT License](http://opensource.org/licenses/MIT)