Javascript 从content.drawSvg中的数组传递文件名时出错

我正在画布上绘制SVG文件

为此，我在画布上使用canvg Javascript SVG解析器和渲染器

如果我使用：

drawSvg（'/static/images/awesome_tiger.svg'，0,0400*scaleValue，400*scaleValue）

那么它工作得很好

但如果我使用：

drawSvg（图像[0]，0，0，400*scaleValue，400*scaleValue）

那么下面的错误就来了

错误：未捕获类型错误：对象#在canvg.js中没有方法“substr”

images=[“/static/images/awesome_tiger.svg”]

原始代码：

var dataJSON = data || [];
    var dataJSON2 = data2 || [];
    window.onload = function(){ 
        var canvas = document.getElementById("myCanvas");
        var context = canvas.getContext('2d');

        //tooltipTxt = ["Region 1", "Region 2", "Region 3"];
        var tooltip = null,
                timer;

        console.log(dataJSON);
        var files = ["/static/images/awesome_tiger.svg", "/static/images/green1.png", "/static/images/pink.png"],
        images = [],
        numOfFiles = files.length,
        count = numOfFiles;
        // in files variable no use of svg name. 
        //var x = canvg('myCanvas', '/static/images/awesome_tiger.svg') In this we can load svg with this method also but we used drawSvg method

        /// function to load all images in one go
        function loadImages() {
            /// go through array of file names
            for(var i = 0; i < numOfFiles; i++) {
                /// create an image element
                var img = document.createElement('img');
                /// use common loader as we need to count files
                img.onload = imageLoaded;

                //img.onerror = ... handle errors
                img.src = files[i];                 
                /// push image onto array in the same order as file names
                images.push(img);

            }
        }
        loadImages();
        function imageLoaded(e) {
            /// for each successful load we count down
            count--;
            //if (count === 0) 
            if (count === 0) 
            start(); //start when nothing more to count
        }
        function start() {
        context.clearRect(0, 0, canvas.width, canvas.height);   
        context.drawSvg('/static/images/awesome_tiger.svg', 0, 0, 400*scaleValue, 400*scaleValue);  

           for(var i = 0, pos; pos = dataJSON[i]; i++) {

               /// as we know the alpha ball has index 1 we use that here for images
               context.drawImage(images[1], pos.x, pos.y, 20/scaleValue, 20/scaleValue);
           }
            for(var i = 0, pos; pos = dataJSON2[i]; i++) {             
               context.drawImage(images[2], pos.x, pos.y, 20/scaleValue, 20/scaleValue);
           }
        }

        function draw1(scaleValue){             
            context.save();     
            context.setTransform(1,0,0,1,0,0)   
            context.globalAlpha = 0.5;                      
            context.clearRect(0, 0, canvas.width, canvas.height);   
            context.restore();          
            context.save(); 
            context.drawSvg('/static/images/awesome_tiger.svg', 0, 0, 400*scaleValue, 400*scaleValue)
            context.scale(scaleValue, scaleValue);
            for(var i = 0, pos; pos = dataJSON[i]; i++) {
                   /// as we know the alpha ball has index 1 we use that here for images
                   context.drawImage(images[1], pos.x, pos.y, 20/scaleValue, 20/scaleValue);
               }    
            for(var i = 0, pos; pos = dataJSON2[i]; i++) {
                   /// as we know the alpha ball has index 1 we use that here for images
                   context.drawImage(images[2], pos.x, pos.y, 20/scaleValue, 20/scaleValue);
               }
            context.restore();
        }; 
        draw1(scaleValue);


    }   

var-dataJSON=data | |[]；
var dataJSON2=data2 | |[]；
window.onload=函数（）{
var canvas=document.getElementById（“myCanvas”）；
var context=canvas.getContext（'2d'）；
//tooltipTxt=[“区域1”、“区域2”、“区域3”]；
var工具提示=null，
定时器；
log（dataJSON）；
var files=[“/static/images/awesome_tiger.svg”、“/static/images/green1.png”、“/static/images/pink.png”]，
图像=[]，
numofiles=files.length，
count=numOfFiles；
//在变量文件中，不使用svg名称。
//var x=canvg（'myCanvas'，'/static/images/awesome_tiger.svg'）在这种情况下，我们也可以使用这种方法加载svg，但我们使用了drawSvg方法
///函数一次加载所有图像
函数loadImages（）{
///浏览文件名数组
对于（var i=0；i

您向我们展示的内容不会导致该错误。你确定数组吗？@Archer:我用原始代码编辑了我的问题。在将图像推入数组之前，你正在运行

imageLoaded

。使用文件数组而不是图像数组。@Archer:尝试过，但没有结果。可能是我做错了什么。上述问题来源再次更新。请再看一次。非常感谢。