Typically, the toon shader works well when the character is in a non-animated state.
However, when applying animation, the toon shader entity does not function as expected.
The toon shader takes the mesh instance from the existing entity and adds it as a child to a new entity.
So, I want to bring along skeleton data in this process to enable animations.
I haven’t tried it myself but you can use the skinInstance property to get a reference to the original skin (animated skeleton) and add it to the second mesh instance added. I think afterwards both mesh instances will be animated from the same skeleton:
...
var renders = this.entity.render.meshInstances;
for (var r = 0; r < renders.length; r++) {
var mesh = renders[r];
console.log(mesh); // Exist skinInstance
console.log(mesh.skinInstance); // null
...
After checking the logs, I’ve noticed that simply outputting the mesh shows the skinInstance property. However, when I output mesh.skinInstance, it returns null.
Where is my skinInstance?
Instead of trying to create / assign skin instances yourself, perhaps try to just assign a rootBone entity (which is the root of the skeleton) to the render component, that clones skin instances internally.
I’m so sorry to bother you. @mvaligursky
Maybe this is the last question.
...
var clone = this.entity.clone();
clone.setLocalScale(1,1,1);
clone.name = 'clone';
clone.removeComponent('script');
for (var i = clone.children.length - 1; i >= 0; i--) {
clone.children[i].destroy();
}
var renders = clone.render.meshInstances;
for (var r = 0; r < renders.length; r++) {
var mesh = renders[r];
var newMaterial = mesh.material;
newMaterial.chunks.lightDiffuseLambertPS = lightDiffuseToonPS;
newMaterial.setParameter("texture_ramp", ramp);
newMaterial.update();
var edgeMat = newMaterial.clone();
edgeMat.chunks.transformVS = transformToonEdgeVS;
edgeMat.customFragmentShader = edgePS;
edgeMat.cull = pc.CULLFACE_FRONT;
edgeMat.update();
mesh.material = edgeMat; // Lost skinInstance
mesh.setParameter("edgeSize", this.edgeSize);
mesh.setParameter("edgeColor", this.edgeColor.data);
mesh.updateKey();
}
clone.render.rootBone = this.entity.render.rootBone;
this.entity.addChild(clone);
I created the entity using a cloning method, but during the process of adding the material, the skinInstance seems to be lost. (I confirmed this through the logs.)
Using skinInstance and rootBone together seems to trigger the skinInstance lock issue.
Is it natural for the skinInstance to disappear during the process of adding the material originally?
Hey … had a quick look, and I get the same problem (as expected), but I don’t have much time to debug this, as the code handling it is non-trivial under the hood.
What is it exactly you’re trying to do? Do you want to clone the whole character with different shader? Or do you want the same character but change its shaders? As it’s likely there is a simpler solution than this.
Thank you for taking a look at the project. @mvaligursky
I believe what I want is to use the same character while only changing the shader.
Since I’m a beginner when it comes to shaders, I’ve adopted this script.
From briefly examining the code,
it seems to take the existing mesh instance and add a ramp texture to the material.
Then, it creates a new entity beneath it with the original material replaced by a black-filled one to implement an outline effect.
I have a general understanding of this process, but I don’t have the specifics.
Ultimately, if I can achieve the toon shading effect without complications, I think any method will suffice.
P.S. - Since there isn’t much time left before the mid-term deadline, if it takes too long, I plan to proceed without the outline effect. However, in the final result, I do want to apply the outline effect as well.
