나는 내가 가지고있는 문제에 대한 약간의 예를 만들었습니다. 아래 그림과 같이 ("추가"버튼을 누르면) 레이어에 사각형이 추가됩니다. 나는 그때가 추가하지 않습니다, 그러나 .. 지금까지 ...KineticJS 레이어에서 항목 제거
가 지금은 다른 항목을 추가하려고 ... 제거 버튼을 눌러 좋은
... 모두 같은 항목을 제거 할 수 있습니다 그 레이어는 여전히 존재하는 것처럼 보입니다.
내가 뭘 잘못하고 있는지 누가 알 수 있습니까?
<html>
<head>
<title>Add/Remove Blocks</title>
<style>
body {
margin: 0px;
padding: 0px;
}
#buttons > input {
padding: 10px;
display: block;
margin-top: 5px;
}
</style>
<!-- Include script files -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript" src="scripts/kinetic-v4.2.0.min.js"></script>
<script type="text/javascript">
var layer;
var stage;
$(document).ready(function() {
// Create the stage
stage = new Kinetic.Stage({
container: 'container',
width: 578,
height: 200
});
// Now add a new layer
layer = new Kinetic.Layer();
// add the layer to the stage
stage.add(layer);
});
// Add a block to the screen
function AddBlock()
{
// Create the name item
var newItemName = "Block1";
// Create the first block
var rect = new Kinetic.Rect({
x: 100,
y: 100,
width: 10,
height: 10,
fill: 'black',
strokeWidth: 4,
id: newItemName,
name: newItemName
});
// Add the block and draw it as well.
layer.add(rect);
layer.draw();
}
// Remove a block
function RemoveBlock()
{
// Get the name
var itemName = "Block1";
// Get the shape
var shape = stage.get(itemName)[0];
// Now remove it
layer.remove(shape);
}
</script>
</head>
<body>
<div id="buttons">
<input type="button" value="Add" id="Add" onclick="AddBlock();">
<input type="button" value="Remove" id="Remove" onclick="RemoveBlock();">
</div>
<div id="container"> </div>
</body>
</html>
TIA 어떤 도움이 필요하십니까?
폴
EDITED IN : - 밝혔다되고 있음을, 나는 단지로 문제를 해결할 수
은 조금 더가 (아래 그림 참조) 내 스크립트에 몇 가지 오류가 있다고 보인다 그것으로보고 데 스크립트와 내가 사용 된 운동의 버전 변경 :
을 그래서를 - 운동 버전 4.0.1로 ...
나는에 코드를 변경했습니다 :
// Remove a block
function RemoveBlock()
{
// Get the name
var itemName = ".Block1";
// Get the shape
var shape = layer.get(itemName)[0];
// Now remove it
layer.remove(shape);
layer.draw();
}
질문은 여전히 있지만 - Kinetic 깨는 것들의 새로운 버전입니까? 아니면 근본적으로 잘못된 것을하고 있습니까?
jsfiddle을 만들어서 무슨 일인지보실 수 있습니까? – SoluableNonagon