2012-03-22 9 views
11

Me preguntaba si alguien podría arrojar algo de luz sobre la forma en que se administran las capas en Canvas y KineticJS. Me cuesta entender por qué cuando borro(); una capa, luego usa el dibujo(); funcionar en esa capa de nuevo, vuelve con las formas, etc. que originalmente agregué a esa capa.Comprensión de limpieza de capa de Canvas & KineticJS

por ejemplo:

http://jsfiddle.net/vPGbz/1/

I supone la limpieza de una capa elimina por completo, y con el fin de volver a dibujar lo que tendría que establecer nuevas formas y construir una nueva capa.

Si alguien pudiera explicarme esto, estaría muy agradecido.

Cheers, Caius

+3

¡Perdón por la confusión! Trabajaré en reforzar los documentos de KineticJS –

+0

@EricRowell sería increíble si pudiera agregar una función .removeAll! –

+0

@EricRowell nevermind, encontrado removeChildren() –

Respuesta

10

Uno tiene que ser honesto que this documentation no se considerará súper detallado, pero como se puede ver aquí: http://jsfiddle.net/vPGbz/2/clear sólo eliminará la representación dibujada de una capa del objeto Stage. Lo que está buscando es el método remove que se utiliza para eliminar ciertos elementos de la capa.

igual:

circleLayer.remove(circle); 
+0

Esto ayuda, gracias. La documentación es bastante vaga. Estoy bastante acostumbrado a leer API Docs, pero esto me resulta difícil de descifrar. –

+0

@CaiusEugene más como inexistente .... – m90

+0

@ m90 La documentación es atroz. Encuentro que la única sección útil es la del tutorial, pero si eso no responde a su (s) pregunta (s), no tiene suerte – puk

7

Por ahora, se podría hacer layer.children = []; pero no sé si esto tendrá algún efecto secundario que no debe!

Editar: No hacer esto. En su lugar, haga esto: layer.removeChildren() encontrado en http://kineticjs.com/api-docs.php bajo Container.

0

Estoy usando Kinetics 4.3.1. estoy haciendo dos capas, por lo que puede agregar y quitar uno de ellos con la casilla de verificación,

se puede comprobar a cabo este enlace: http://jsfiddle.net/lauraliparulo/uw25p/

Algo como esto:

checkBoxItem.addEventListener('click', function() { 
     if (this.checked) { 
      load(); 
      stage.add(layer2); 
     } 

     else if (!this.checked) { 
      layer2.clear(); 
     } 

    }); 

: -)