buuing / lucky-canvas Goto Github PK

3.14版本 当奖品列表只有两个奖品时，转盘会一直转 不会停下来。
prizes: [{
background: "#f8d384",
fonts: [{text: "1元红包", top: "8%"}],
imgs: [{src: i("083c"), width: "30%", top: "25%"}]
}, {
background: "#f9e3bb",
fonts: [{text: "100元红包", top: "8%"}],
imgs: [{src: i("2bd0"), width: "30%", top: "25%"}]
}]

该问题是因为微信小程序的 canvas 组件的 arcTo 绘制异常导致的, 微信团队于 18 年确认了这个 bug , 但是至今未修复

目前的解决方案是使用 arc 代替 arcTo , 但是就无法使用 gutter 属性了, 并且我还需要时间来做兼容, so请大家耐心等待

可以看到您的fonts属性 需要的是一个数组值，里面支持修改字体颜色，样式等等，但是您的fonts中的text为什么接收的是以个数组呢，不应该是{ text: "1元红包", top: '10%',fontColor:"red"},
{ text: "100元红包", top: '10%',fontColor:"green"},
{ text: "0.5元红包", top: '10%',fontColor:"yellow"},
这样嘛？不然字体的颜色和样式不可以区分修改，那些属性将没有意义了， 或许这个不是bug，但是我觉得这样可能更方便一点，希望您帮忙改一下

插件接入webview后，初始化的时候服务器图片不显示，第一次点击抽奖之后才会正常显示

九宫格抽奖 (新增)

• 支持m*n宫格自定义配置 (可以配置任意n宫格, 随意纵向或横向合并宫格, 任意大小, 任意形状随心控制)
• 文字可以配置绘制样式, 字体大小, 字体行高, 随意控制换行
• 支持引入多图片, 并支持实时更新图片的渲染, 比如抽奖次数的更新, 或者奖品的更新
• 针对移动端显示效果, 可以自动根据dpr (设备像素比) 调解 canvas 的显示清晰度

大转盘抽奖 (重构之后)

• 会对参数进行调整 (更加规范语义化)
• 支持多图片引入
• 可自定义渲染抽奖的指针
• 同样会根据dpr自动调解清晰度

浪费老子时间，开始转的回调 已经改变了currIndex，转完指针竟然停在一开始默认的currIndex，去你吗的啊，测都不测完尼玛的，难不成刚进页面就请求？？？日你大爷，给你一🔪。

怎么设置抽奖次数 如果是0次 就不能抽奖 要怎么配置

传入开始旋转时间和缓慢旋转时间，没有生效，且直接调用stop停止旋转时，从开始到完全停止结束，有15S，不知道出现了什么问题

希望点击开始的 时候 可以快速旋转

您好。您插件的异步抽奖，可以在接口返回数据之前，开始转动吗？因为接口延迟的原因会出现点击按钮不能及时转动的情况。

如题，目前开始旋转到结束要15秒左右的时间有点太久了
版本号3.14

还应该增加的抽奖类型：摇一摇和老虎机

使用rem，求告知

"vue-luck-draw": "^1.2.0",

异步请求好像还不对，给的例子，异步怎么搞？是我哪里姿势不对？

机型：红米10x
系统：安卓10

[Vue warn]: Error in event handler for "view.vdSyncCallback": "TypeError: e.getSystemInfoSync is not a function"

从新$set(this.btnConfig , "imgs" 修改图片路径，图片没有重绘成功，有没有手都冻调用update的接口

我尝试过计算属性

如图，通过接口拿到的奖品信息，里面有图片地址并且能够访问到图片，还有个本地base64的图片，结果转盘上不能显示图片。
同样的数据复制出来，写死数据，能够正常渲染。这是为什么啊？

this.$refs.LuckyWheel.stop(Math.random() * 8 >> 0)
这个结束的速度太快了，我想给用户一点刺激的紧迫感，应该如何改源码呢，没找到哎，谢谢亲

您好，移动端如何适配？用rem单位不生效，还是固定的大小。所以怎么适配移动端的不同屏幕而等比例的放大缩小

有3.16版本的实例代码吗，我一直没有找到。

加一个结束的时间好一点，且每一个奖品块里面加一个奖品Icon图标的设置会好很多

我想让 旋转减速 慢慢减速 那种效果 怎么设置

文档中心的服务器挂了，，

小程序构建完成后,编译执行无法执行,报错

appservice?t=1607306804020:1237 miniprogram_npm/mini-luck-draw/lucky-grid/index.js:
Error: module "miniprogram_npm/mini-luck-draw/lucky-grid/lucky-canvas.js" is not defined
at require (VM157 WAService.js:18)
at VM157 WAService.js:18
at Object. (external "lucky-canvas":1)
at webpack_require (bootstrap:19)
at Object. (index.js:1)
at webpack_require (bootstrap:19)
at bootstrap:83
at bootstrap:83
at wrapFn (appservice?t=1607306804020:1230)
at require (VM157 WAService.js:18)

请问在圆形转盘中的img支持传入的格式有哪些？除了本地可以，base64，blob可以吗？

当抽奖完成后 ，需要重绘canvas中间的开始按钮，修改btnConfig中的img图片

后期会加上图片支持吗？

下载下来无法找到main.js

抽奖中标，或者划过中标，希望可以进行缩放（放大效果）。这个怎么做呢？有相关配置吗

LuckyWheel-大转盘对移动端不是很友好，轻触不会启动转盘，需要快速点击2次；

应该需要加一个 touch 事件

抽奖按钮合并格子后点击区域还是合并之前的区域

runtime-core.esm-bundler.js?5c40:1781 Uncaught (in promise) TypeError: Right-hand side of 'instanceof' is not an object

<template>
  <div class="draw">
    <LuckyGrid
      style="width: 265px; height: 200px"
      rows="3"
      cols="4"
      :blocks="[{ padding: '5px', background: '#ff4a4c', borderRadius: 10 }]"
      :prizes="[
        { x: 0, y: 0, fonts: [{ text: '0元', top: 20 }] },
        { x: 1, y: 0, fonts: [{ text: '1元', top: 20 }] },
        { x: 2, y: 0, fonts: [{ text: '2元', top: 20 }] },
        { x: 3, y: 0, fonts: [{ text: '3元', top: 20 }] },
        { x: 3, y: 1, fonts: [{ text: '4元', top: 20 }] },
        { x: 3, y: 2, fonts: [{ text: '5元', top: 20 }] },
        { x: 2, y: 2, fonts: [{ text: '6元', top: 20 }] },
        { x: 1, y: 2, fonts: [{ text: '7元', top: 20 }] },
        { x: 0, y: 2, fonts: [{ text: '8元', top: 20 }] },
        { x: 0, y: 1, fonts: [{ text: '9元', top: 20 }] },
      ]"
      :button="{ x: 1, y: 1, col: 2, fonts: [{ text: '抽奖按钮', top: 20 }] }"
    />
  </div>
</template>

<script lang="ts">
import { defineComponent } from "vue";
export default defineComponent({
  name: "Draw",
  data() {
    return {
      userId: "1231231231231221",
      userType: "",
      message: "",
      count: "",
      originId:
        process.env.DOMAIN_ENV == "dev" ? "gh_591ecf2e2417" : "gh_9fef032315c1",
    };
  },
});
</script>

<style lang="scss" scope="scope">
.demo {
  img {
    width: 250px;
  }
}
</style>

我想在点击抽奖前 写一些方法 执行完成了再开始抽奖

请问怎样可以配置概率 或者可不可以接口返回哪个值 之后转盘就转到哪个值

问一下，大佬，大转盘上的图片和文字的位置可以交换吗？

第一步：npm i vue-luck-draw
第二部：main.js 里面
import LuckDraw from 'vue-luck-draw'
Vue.use(LuckDraw)
第三步：页面使用

  

star!!
请问执行 this.$refs.LuckDraw.play() 后报错，求大佬帮忙看看
Uncaught DOMException: Failed to execute 'drawImage' on 'CanvasRenderingContext2D': The HTMLImageElement provided is in the 'broken' state.

如题

ctx.fillStyle = awards[i].color || i % 2 == 0 ? '#f8d384' : '#f9e3bb' 这里存在bug ，运算符优先级问题，括号把后面括起来应该可以解决

版本：<= v3.2.1

问题描述： 大转盘中当defaultConfig.speed设置的值低于20的时候, 减速的时候会不太自然, 九宫格看着还行

预计优化时间： 我ts移植完之后会再次优化一下减速函数, 目前大转盘推荐的速度为20 ~ 30

如果你遇到了该问题并希望使用低于20的速度, 请下面留言, 我会在修复之后第一时间回复你