Javascript 奇怪的画布绘制行为

我有一个CodeIgniter应用程序，允许企业在线完成某些报告。报告的一部分是，它们可以在车辆上指示发生损坏的位置。我是通过一块画布来完成的，他们可以在上面画画

问题是，在绘制背景图像（汽车）时，会出现一些非常奇怪的行为，他们在背景图像上绘制箭头以显示影响等

以下是Javascript（作为整个脚本的一部分）：

这是名为vehicle_canvas.js的脚本的所有部分。这就是奇怪行为的来源。此脚本是使用

在位于/intranet/application/views/view_instruction.php的视图文件中

脚本只是没有绘制车辆图像，但其他所有操作都正确，然后突然工作起来，原因是我不小心将vehicle_canvas.js上传到了另一个文件夹/intranet/pdfs/而不是/intranet/js/。现在，如果我从/pdfs/中删除脚本，它将无法工作/在任何my view文件或Javascript调用中都不会出现PDF/文件

有什么想法吗

以下是供参考的文档树：

/intranet/
    /pdfs/ 
    /js/  
        /application/  
            /views/  
                 view_instruction.php

---

我认为您可能需要将内容剥离回最简单的形式—可能是缓存的内容，因此请确保进行完全刷新，等等

至于图像的怪异之处：可能是因为在尝试将图像绘制到canvas元素之前，图像尚未完全加载。您应该等待页面加载（或者更好，图像加载），否则它将失败。比如：

var img = new Image();
img.onload = function(){
  context.drawImage(img, 10, 5, img.width, img.height);
}
img.src = "/intranet/images/car.png";

---

Google Chrome analysis甚至显示了从/JS/vehicle_canvas.JS调用的JS文件，即使该文件也在/pdfs/中，因此它可以工作。或者，如果要加载多个图像，请设置一个启动操作的

窗口.onload

（或

窗口.addEventListener（'load'，function（）{…}，false）

），然后为所有图像设置

.src

。

var img = new Image();
img.onload = function(){
  context.drawImage(img, 10, 5, img.width, img.height);
}
img.src = "/intranet/images/car.png";