效果展示:
threejs的初始知识点,我就不赘述了,网上和官方文档,都有很多,很详细的内容。大家感兴趣的可以自行阅读查看。
素材我是在这个网站下的
创意设计
<template>
<div class="maskLoading" v-if="isLoading">
<div class="loading">
<div :style="{width : loadingWidth +'%' }"></div>
</div>
<div style="">{
{
parseInt(loadingWidth)}}%</div>
</div>
<div class="mask">
<div class="top">
<el-button @click="isAutoFun">转动车</el-button>
<el-button @click="stop">停止</el-button>
<div class="info">x : {
{
x}} y:{
{
y}} z :{
{
z}}</div>
</div>
<h2>创意设计</h2>
<div>
<h5>修改区域:</h5>
<div class="part">
<el-button :type="buttonIndex === index ? 'primary' : ''" v-for="(btn, index) in buttonList" @click="changePart(btn.key, index)">{
{
btn.label }}</el-button>
</div>
</div>
<div>
<h5>颜色选择:</h5>
<div class="demo-color-block">
<el-color-picker v-model="colorKey" @change="setCarColor" color-format="rgb" />
</div>
</div>
</div