Загрузка изображения на холст с помощью JavaScript? - PullRequest
0 голосов
/ 07 ноября 2018

Я новичок в 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>

`

1 Ответ

0 голосов
/ 07 ноября 2018

Вы вводите неправильный путь, [\] в javascript избегает следующей буквы

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

, поэтому, когда вы указываете путь как «\ Images \ trial.jpg», это приводит к Images rial.jpg

Вы можете либо уйти от пути, использовать String.raw this my \n really raw path или просто указать путь в обратных чертах [like this]

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...