three实现带声效可导出excel抽奖结果炫酷年会抽奖效果代码-html代码-BFW代码库

代码语言：html

所属分类：其他

代码描述：three实现带声效可导出excel抽奖结果炫酷年会抽奖效果代码，通过js变量设置抽奖人员名单和抽奖奖品，点击抽奖可实现不同奖项的抽奖，最终可将抽奖结果导出为excel表格，只需要修改js变量cfgData.prizes及用户变量leftUsers即可

代码标签： three 导出 excel 抽奖结果炫酷年会抽奖效果代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html>

<head>
    <title>年会抽奖</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,user-scalable=no,minimum-scale=1,maximum-scale=1">

</head>

<body>
    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/three.100.js"></script>
    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/Tween.16.7.0.js"></script>
    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/TrackballControls.100.js"></script>
    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/CSS3DRenderer.js"></script>
    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/xlsx.full.min.js"></script>
    <div class="canvas-box">
        <canvas id="canvas">你的浏览器不支持canvas</canvas>
    </div>
    <div class="music">
        <audio id="music" src="//repo.bfw.wiki/bfwrepo/sound/65af35153df39.mp3" class="music-item" loop></audio>
        <div id="musicBox" class="music-box" title="播放/暂停背景音乐">Music</div>
    </div>
    <div id="prizeBar"></div>
    <div id="container"></div>
    <div id="menu">
        <button id="enter">进入抽奖</button>
        <div id="lotteryBar" class="none">
            <button id="lottery">开始抽奖</button>
            <button id="reLottery">重新抽奖</button>
            <div class="fixed-bar">
                <button id="save" class="fixed-btn">导出抽奖结果</button>
                <button id="reset" class="fixed-btn">重置</button>
            </div>
        </div>
    </div>
    <div class="qipao-container"></div>
    <script type="text/javascript">
        const cfgData = {
  prizes: [
    { type: 0, count: 1000, title: "", text: "特别奖" },
    { type: 1, count: 2, text: "特等奖", title: "神秘大礼", img: "//repo.bfw.wiki/bfwrepo/images/jiangpin/secrit.jpg" },
    { type: 2, count: 5, text: "一等奖", title: "Mac Pro", img: "//repo.bfw.wiki/bfwrepo/images/jiangpin/mbp.jpg" },
    { type: 3, count: 6, text: "二等奖", title: "华为 Mate30", img: "//repo.bfw.wiki/bfwrepo/images/jiangpin/huawei.png" },
    { type: 4, count: 7, text: "三等奖", title: "Ipad Mini5", img: "//repo.bfw.wiki/bfwrepo/images/jiangpin/ipad.jpg" },
    { type: 5, count: 8, text: "四等奖", title: "大疆无人机", img: "//repo.bfw.wiki/bfwrepo/images/jiangpin/spark.jpg" },
    { type: 6, count: 8, text: "五等奖", title: "Kindle", img: "//repo.bfw.wiki/bfwrepo/images/jiangpin/kindle.jpg" },
    { type: 7, count: 12, text: "六等奖", title: "漫步者蓝牙耳机", img: "//repo.bfw.wiki/bfwrepo/images/jiangpin/edifier.jpg" }
  ],
  EACH_COUNT: [1, 1, 5, 6, 7, 8, 9, 12],//每次最多抽奖人数，超过会分多次进行
  COMPANY: "MoShang"
};

const leftUsers = [
 ["000033", "伊万", "技术部"],
    ["000068", "贝克尔", "技术部"],
    ["000203", "宝官", "销售部"],
    ["000301", "蕾哈娜", "销售部"],
    ["000074", "特松佳", "技术部"],
    ["000002", "哈勒普", "技术部"],
    ["000080", "贾元春", "技术部"],
    ["000001", "OSAKA", "人事部"],
    ["000094", "雪雁", "人事部"],
    ["000066", "索萨", "人事部"],
    ["000049", "锦织圭", "人事部"],
    ["000046", "安德森", "质量部"],
    ["000091", "麝月", "质量部"],
    ["000003", "黑妹", "质量部"],
    ["000037", "考特", "质量部"],
    ["000107", "贾珍", "质量部"],
    ["000050", "伊斯内尔", "质量部"],
    ["000019", "王蔷", "质量部"],
    ["000073", "马胡", "产品部"],
    ["000071", "穆雷", "产品部"],
    ["000097", "平儿", "产品部"],
    ["000057", "戈芬", "产品部"],
    ["000054", "西西帕斯", "产品部"],
    ["000042", "纳达尔", "产品部"],
    ["000079", "贾宝玉", "产品部"],
    ["000092", "袭人", "产品部"],
    ["000065", "克里赞", "产品部"],
    ["000030", "萨拉波娃", "产品部"],
    ["000300", "布兰妮", "产品部"],
    ["000006", "小白菜", "研发部"],
    ["000017", "梅尔滕斯", "研发部"],
    ["000102", "贾政", "研发部"],
    ["000053", "福格尼尼", "研发部"],
    ["000045", "大师兄", "研发部"],
    ["000108", "贾蓉", "研发部"],
    ["000012", "巴蒂", "研发部"],
    ["000083", "李纨", "研发部"],
    ["000051", "卡恰", "研发部"],
    ["000022", "奥胖", "研发部"],
    ["000075", "吴迪", "研发部"],
    ["000305", "A妹", "研发部"],
    ["000063", "米尔曼", "研发部"],
    ["000206", "蕊官", "研发部"],
    ["000058", "阿古特", "教育部"],
    ["000201", "碧昂丝", "教育部"],
    ["000020", "加西亚", "教育部"],
    ["000209", "芳官", "教育部"],
    ["000211", "麦丹娜", "教育部"],
    ["000048", "蒂姆", "教育部"],
    ["000088", "秦可卿", "教育部"],
    ["000008", "科贝尔", "教育部"],
    ["000015", "格格", .........完整代码请登录后点击上方下载按钮下载查看