我在BabylonJs的一个项目上工作,我选择了我的网格问题。我认为这是OOP或者PickResult.pickedMesh的问题,我不确定。我尝试了很多这样的事情。但没有任何作用:(。
问题是当我点击一个网格我可以移动它,颜色等。但是如果我点击另一个网格,第一个保持选中,我修改两个网格。我想修改最后一个点击的网格,而不是所有的网格:( ..
处理点击和移动的代码部分:
function canvasClick() {
canvas.addEventListener("click", function (evt, pickResult) {
//offsetX/Y are not implemented on FireFox
var offsetX = (evt.offsetX || evt.clientX - $(evt.target).offset().left + window.pageXOffset);
var offsetY = (evt.offsetY || evt.clientY - $(evt.target).offset().top + window.pageYOffset);
pickResult = scene.pick(offsetX, offsetY);
this.pickResult = pickResult;
// if the click hits the ground object, we change the impact position
if (this.pickResult.pickedMesh) {
positionFull = this.pickResult.pickedMesh.position;
positionHtmlX = positionFull.toString().split('Y', [1]).toString().slice([4]);
positionHtmlY = positionFull.toString().split('Z', [1]).toString().split('').reverse().join('').split(':', [1]).toString().split('').reverse().join('');
positionHtmlZ = positionFull.toString().split('').reverse().join('').slice([1]).split(':', [1]).toString().split('').reverse().join('');
scalingFull = this.pickResult.pickedMesh.scaling;
scalingHtmlX = scalingFull.toString().split('Y', [1]).toString().slice([3]);
scalingHtmlY = scalingFull.toString().split('Z', [1]).toString().split('').reverse().join('').split(':', [1]).toString().split('').reverse().join('');
scalingHtmlZ = scalingFull.toString().split('').reverse().join('').slice([1]).split(':', [1]).toString().split('').reverse().join('');
/* Mouvement */
$('#Forward').on("click", function () {
pickResult.pickedMesh.position.z += 1;
});
$('#Backward').on("click", function () {
pickResult.pickedMesh.position.z -= 1;
});
$('#Right').on("click", function () {
pickResult.pickedMesh.position.x += 1;
});
$('#Left').on("click", function () {
pickResult.pickedMesh.position.x -= 1;
});
$('#Up').on("click", function () {
pickResult.pickedMesh.position.y += 1;
});
$('#Down').on("click", function () {
pickResult.pickedMesh.position.y -= 1;
});
$('#Down').on("click", function () {
pickResult.pickedMesh.position.y -= 1;
});
$('#Down').on("click", function () {
pickResult.pickedMesh.position.y -= 1;
});
/* Rotation */
$('#RotationLeft').on("click", function () {
pickResult.pickedMesh.rotation.y -= Math.PI / 6;
});
$('#RotationRight').on("click", function () {
pickResult.pickedMesh.rotation.y += Math.PI / 6;
});
/* Scaling */
/* x */
$('#Scalingxplus').on("click", function () {
pickResult.pickedMesh.scaling.x += 5;
});
$('#Scalingxmoins').on("click", function () {
pickResult.pickedMesh.scaling.x -= 5;
});
/* y */
$('#Scalingyplus').on("click", function () {
pickResult.pickedMesh.scaling.y += 5;
});
$('#Scalingymoins').on("click", function () {
pickResult.pickedMesh.scaling.y -= 5;
});
/* z */
$('#Scalingzplus').on("click", function () {
pickResult.pickedMesh.scaling.z += 5;
});
$('#Scalingzmoins').on("click", function () {
pickResult.pickedMesh.scaling.z -= 5;
});
/* Color */
/* Bleu */
$('#bleu').on("click", function () {
pickResult.pickedMesh.material.diffuseColor = new BABYLON.Color3(0, 0, 1);
});
/* BleuPlus */
$('#bleuPlus').on("click", function () {
pickResult.pickedMesh.material.diffuseColor = new BABYLON.Color3(0, 1, 1);
});
/* Vert */
$('#vert').on("click", function () {
pickResult.pickedMesh.material.diffuseColor = new BABYLON.Color3(0, 0.5019607843137255, 0);
});
/* VertPlus */
$('#vertPlus').on("click", function () {
pickResult.pickedMesh.material.diffuseColor = new BABYLON.Color3(0.6784313725490196, 1, 0.6784313725490196);
});
/* Jaune */
$('#jaune').on("click", function () {
pickResult.pickedMesh.material.diffuseColor = new BABYLON.Color3(1, 1, 0);
});
/* Orange */
$('#orange').on("click", function () {
pickResult.pickedMesh.material.diffuseColor = new BABYLON.Color3(1, 0.6470588235294118, 0);
});
/* Blanc */
$('#blanc').on("click", function () {
pickResult.pickedMesh.material.diffuseColor = new BABYLON.Color3(1, 1, 1);
});
/* Rose */
$('#rose').on("click", function () {
pickResult.pickedMesh.material.diffuseColor = new BABYLON.Color3(1, 0.7529411764705882, 0.796078431372549);
});
/* VioletPlus */
$('#violetPlus').on("click", function () {
pickResult.pickedMesh.material.diffuseColor = new BABYLON.Color3(0.9333333333333333, 0.5098039215686275, 0.9333333333333333);
});
/* Violet */
$('#violet').on("click", function () {
pickResult.pickedMesh.material.diffuseColor = new BABYLON.Color3(0.5019607843137255, 0, 0.5019607843137255);
});
/* Rouge */
$('#rouge').on("click", function () {
pickResult.pickedMesh.material.diffuseColor = new BABYLON.Color3(1, 0, 0);
});
/* OrangePlus */
$('#orangePlus').on("click", function () {
pickResult.pickedMesh.material.diffuseColor = new BABYLON.Color3(1, 0.2705882352941176, 0);
});
/* Suppression Object */
$('#Remove_group').on("click", function () {
pickResult.pickedMesh.dispose();
});
};
});
}
答案 0 :(得分:3)
您应该将活动更改为:
var that = this;
$('#Forward').on("click", function () {
that.pickResult.pickedMesh.position.z += 1;
});