写在前:按照比例绘制饼状图
实现效果:
布局
<view class="left">
<cover-view class="white"></cover-view>
<canvas style="width: 136px; height: 136px;" canvas-id="Canvas"></canvas>
</view>
样式
page {
width: 100%;
height: 100%;
}
.left {
width: 300rpx;
height: 300rpx;
display: flex;
justify-content: center;
align-items: center;
position: relative;
}
.white {
width: 136rpx;
height: 136rpx;
border-radius: 50%;
position: absolute;
top: 50%;
left: 50%;
z-index: 10;
background-color: #fff;
transform: translate(-50%, -50%);
}
实现效果
Page({
/**