Placing Products into 3d Truck - Using excel input file with dimensions

I just signed up, need to do the below - no clue how to start - any help ???

Excel data with Package/Goods name and dimension will be uploaded to System and based upon the given input, system needs to arrange the goods in best possible way in a given Container/Truck.
Container/Truck dimension will be predefined in Master data.
System should generate a 3D output to see where goods are place and it should be interactive in sense that user can view this from different angle.

Perhaps the hardest part of this has nothing really to do with PlayCanvas - namely, what is the optimal packing arrangement in a container for an arbitrary set of packages. There are various threads online discussing the solution to this problem. For example:

You also need to figure out the best way to get the relevant data out of Excel and into PlayCanvas. You might just want to export to CSV and convert that to JSON before upload, say?

But assuming you know how to solve that, I’ll turn my attention to the parts that are relevant to PlayCanvas. You need to:

  1. Find/create a model of a flatbed truck and import it into your scene.
  2. Procedurally fill the trick with boxes of the size specified in the spreadsheet.

So you algorithm to generate the packages might create an array:

var packages = [];

A package might be defined as:

var package = {
    position: [ x, y, z ],
    rotation: [ x, y, z],
    scale: [ x, y, z ]
};

In other words, it’s position, rotation and scale (size) in 3D space. You can of course store other information about each package - perhaps its weight and color.

To create the visuals for your packages, you might do:

for (var i = 0; i < packages.length; i++) {
    var p = packages[i];
    var e = new pc.Entity();
    e.addComponent('model', { type: 'box' };
    e.setPosition(p.position[0], p.position[1], p.position[2]);
    e.setEulerAngles(p.rotation[0], p.rotation[1], p.rotation[2]);
    e.setLocalScale(p.scale[0], p.scale[1], p.scale[2]);
    this.app.root.addChild(e);
}
1 Like

Tnx Will. A lot of ur answer is french to me as I’ve not coded in a while but I’ll try to follow ur 2 steps above then go from there. Tnx so much, I’ll try to update.

I’ll start with the truck

http://playcanvas.com/editor/scene/465218/launch

tho I need a larger one.

I loaded a truck but then everything went crazy when I tried to script and the trucks no longer showing. I tried to start a new project but truck won’t upload.

I’m using chrome browser mostly.

Remove the script component from the root node:

And you seem to have disabled your camera for some reason:

Switch that to on. That is why the scene is not being rendered.