ferris-wheel-zqh

实现div拖拽功能，限制移动范围为浏览器的可视宽高

Install

npm install ferris-wheel --save-dev

Usage

import Vue from 'vue';
import FerrisWheel from 'ferris-wheel';
Vue.use(FerrisWheel);

<template>
  <div id="app">
    <ferris-wheel></ferris-wheel>
  </div>
</template> 

 Options(摩天轮将充满容器)
 参数/说明/类型/可选值/默认值
 width/容器宽度/Number/—/800
 height/容器高度/Number/—/800
circleImageRadius/圆环图片半径/Number/—/214 
 background/背景/String/—	      
 circleData/摩天轮数据/Array/—	       
[
          { 
            'resourceDesc': 'aaaaa',
            'icon': require('../../images/ferris-wheel/circle-access-plat.png'),
          },
          { 
            'resourceDesc': 'aaaaa',
            'icon': require('../../images/ferris-wheel/circle-access-plat.png'), 
          },
          { 
            'resourceDesc': 'aaaaa',
            'icon': '../../src/images/ferris-wheel/circle-access-plat.png', 
          },
          { 
            'resourceDesc': 'aaaaa',
            'icon': '../../src/images/ferris-wheel/circle-access-plat.png', 
          },
          { 
            'resourceDesc': 'aaaaa',
            'icon': '../../src/images/ferris-wheel/circle-access-plat.png', 
          },
          { 
            'resourceDesc': 'aaacdcccc',
            'icon': '../../src/images/ferris-wheel/circle-access-plat.png', 
          },
          { 
            'resourceDesc': 'aaaaa',
            'icon': '../../src/images/ferris-wheel/circle-access-plat.png', 
          }
        ];
        
方法 
方法名/说明  
wheelClick/点击旋转的wheel(返回当前移入或点击对象)
wheelMouseover/移入旋转的wheel(返回当前移入或点击对象)
wheelMouseout/移出旋转的wheel(返回当前移入或点击对象)