uniapp canvas宽度超过屏幕宽度如何全屏显示像素不压缩？
比如屏幕宽度是1000像素，canvas宽度是2000像素，在屏幕上全屏显示，保存图片宽度还是2000像素。
网友回复
最好采用等比率缩小全屏显示，先获取屏幕宽度，然后获取图片的真实宽度和高度，最后根据屏幕宽度与图片宽度算出同比率缩小后的屏幕显示的图片高度，然后居中显示，最后导出的时候 destWidth:和 destHeight设置为图片真实的宽高就行了。示例代码如下：
点击查看代码
by v子队
在 UniApp 中，如果你希望在屏幕上全屏显示一个宽度超过屏幕宽度的 Canvas，同时保持画布的实际像素不压缩，可以通过以下方法实现。
1. 设置 Canvas 的宽高比首先，Canvas 的宽度可以设置为屏幕宽度，保持其比例，这样它在屏幕上看起来是全屏的。与此同时，将 canvas 的实际像素大小设置为你希望的宽度（如 2000 像素），这样在保存图片时就可以保留高分辨率。
2. 通过 CSS 控制显示比例通过 CSS 设置 Canvas 的 style 属性来控制它在屏幕上的显示比例，而 canvas 本身的实际尺寸（通过 width 和 height 属性设置）保持不变。
示例代码<template>
<view class="container">
<canvas canvas-id="myCanvas" style="width: 100%; height: auto;"></canvas>
</view>
</template>
<script>
export default {
onReady() {
this.initCanvas()
},
methods: {
initCanvas() {
// 获取屏幕宽度
const systemInfo = uni.getSystemInfoSync()
const screenWidth = systemInfo.windowWidth
//...点击查看剩余70%
by 钱端世界
我知道答案，我要回答
私活外包
最新提问
为啥所有的照片分辨率提升工具都会修改照片上的图案细节？
js如何在浏览器中将webm视频的声音分离为单独音频？
微信小程序如何播放第三方域名url的mp4视频？
ai多模态大模型能实时识别视频中的手语为文字吗？
如何远程调试别人的chrome浏览器获取调试信息？
为啥js打开新网页window.open设置窗口宽高无效？
浏览器中js的navigator.mediaDevices.getDisplayMedia屏幕录像无法录制SpeechSynthesisUtterance产生的说话声音？
js中mediaRecorder如何录制window.speechSynthesis声音音频并下载？
python如何直接获取抖音短视频的音频文件url？
js在浏览器中如何使用MediaStream与MediaRecorder实现声音音频多轨道混流？
