Javascript 使用Dynamic在画布上添加更多图像
我正在制作一个应用程序,但我遇到了问题。我需要在按下按钮时在画布上添加新的点图像。下面是一个代码:Javascript 使用Dynamic在画布上添加更多图像,javascript,jquery,html,canvas,kineticjs,Javascript,Jquery,Html,Canvas,Kineticjs,我正在制作一个应用程序,但我遇到了问题。我需要在按下按钮时在画布上添加新的点图像。下面是一个代码: var ID = 0; var points = []; function addPoint(){ points.push({id: ID, posX: 0, posY: 0, url: "img/point.png"}); ID++; showPoints(); } function showPoints(){ var img = new Array(); var point = new A
var ID = 0;
var points = [];
function addPoint(){
points.push({id: ID, posX: 0, posY: 0, url: "img/point.png"});
ID++;
showPoints();
}
function showPoints(){
var img = new Array();
var point = new Array();
var stage = new Kinetic.Stage({
container: 'cvsCroatia',
width: 574,
height: 508
});
var layer = new Kinetic.Layer();
for(var j=0; j < ID; j++){
img[j] = new Image();
img[j].src = 'img/point.png';
img[j].onload = (function(){
point[j] = new Kinetic.Image({
x: points[j].posX,
y: points[j].posY,
image: img[j],
width: 13,
height: 13,
name: img[j],
draggable: true
});
});
layer.add(point[j]);
}
stage.add(layer);
}
但我有一个错误:
未捕获的TypeError:无法设置未定义的Dynamic-v4.4.0.min.js:29的属性“索引”
你知道怎么回事吗?谢谢你的回答。艾伦 谢谢你的回答,我把所有变量都放在了全局范围内,但不幸的是得到了同样的错误
var img = new Array(); // the simplest solution is to make img visible outside your function
function showPoints(){
// var img = new Array(); // HERE img is a LOCAL variable, only visible to the showPoints() function
var point = new Array();
var stage = new Kinetic.Stage({
container: 'cvsCroatia',
width: 574,
height: 508
});
var ID = 0;
var points = [];
var img = new Array();
var point = new Array();
function showPoints(){
var stage = new Kinetic.Stage({
container: 'cvsCroatia',
width: 574,
height: 508
});
var layer = new Kinetic.Layer();
for(var j=0; j < ID; j++){
img[j] = new Image();
img[j].src = 'img/point.png';
img[j].onload = (function(){
point[j] = new Kinetic.Image({
x: points[j].posX,
y: points[j].posY,
image: img[j],
width: 13,
height: 13,
name: img[j],
draggable: true
});
});
layer.add(point[j]);
}
stage.add(layer);
}
function addPoint(){
points.push({id: ID, posX: 0, posY: 0, url: "img/point.png"});
ID++;
showPoints();
}
实际上,您应该将此函数中的所有内容都设置为全局范围