使用JavaScript上传图像到Canvas？

Question

我是JS的新手，但目前正在尝试将图像上传到HTML画布。 代码没有问题，我只是在控制台中不断收到一条错误消息：无法加载资源：服务器以404（未找到）状态进行响应。 在我的IDE中，它说有图像，但是由于某种原因它没有显示在预览中。 任何帮助将不胜感激！

 var canvas = document.querySelector('.canvas1'); canvas.width = window.innerWidth; canvas.height = window.innerHeight; //console.log(canvas); var c = canvas.getContext('2d'); load_image(); var base_image; function load_image() { "use strict"; base_image = new Image(); base_image.src = '\\Images\\trial.jpg'; base_image.onload = function() { c.drawImage(base_image, 0, 0); }; }

 @charset "utf-8"; /* CSS Document */ body { margin: 0; } .canvas1 { height: 100vh; width: 98.7vw; margin: 0; display: block; }

 <!doctype html> <html> <head> <meta charset="utf-8"> <title>Sylvanas</title> <link href="styles.css" rel="stylesheet" type="text/css"> </head> <body> <canvas class="canvas1"> </canvas> <!--<canvas class="canvas2"> </canvas>--> <script src="script.js"></script> </body> </html>

`

Answer 1

您输入的路径错误，javascript中的[\\]会转义下一个字母

 console.log('\\Images\\trial.jpg')

因此，当您将路径放置为“'\\ Images \\ trial.jpg'”时，它会导致Images rial.jpg

您可以转义路径，使用String.raw this my \\n really raw path也可以将路径放入反引号[ like this ]

使用JavaScript上传图像到Canvas？

问题描述

1 个解决方案

解决方案1
0 2018-11-07 05:56:26

使用JavaScript上传图像到Canvas？

问题描述

1 个解决方案

解决方案1 0 2018-11-07 05:56:26

解决方案1
0 2018-11-07 05:56:26