Hi guys,
is there a way for the line to be in front of all objects usando o app.renderLine()?
Hi @vgupgrade,
You can assign a different than the default/world layer to your line that renders on top of everything. That can be the UI layer as well.
// Render a 1-unit long white line into the world layer
var start = new pc.Vec3(0, 0, 0);
var end = new pc.Vec3(1, 0, 0);
var color = new pc.Color(1, 1, 1);
var worldLayer = app.scene.layers.getLayerById(pc.LAYERID_UI);
app.renderLine(start, end, color, {
layer: uiLayer
});
var LineCreate = pc.createScript('lineCreate');
LineCreate.attributes.add('line', {
type: 'boolean',
title: 'Line status',
default: false
});
LineCreate.attributes.add('targetFrom', {
type: 'entity',
title: 'Target From',
});
LineCreate.attributes.add('targetTo', {
type: 'entity',
title: 'Target To',
});
// initialize code called once per entity
LineCreate.prototype.initialize = function() {
this.lineColor = new pc.Color(1,1,1);
this.worldLayer = pc.app.scene.layers.getLayerById(pc.LAYERID_UI);
};
// update code called every frame
LineCreate.prototype.update = function(dt) {
if(this.line==true){
this.app.renderLine(this.targetTo.getPosition(), this.targetFrom.getPosition(), this.lineColor,{
layer: this.worldLayer
});
}
}
;
You are right, I gave it a try on a new project and I am getting the same behavior. @mvaligursky and idea how line rendering is handled here?
In general renderLine() is considered an API meant for debugging primarly. Normally you would be creating lines using the new Mesh API.
Check this post for more info:
I have a PR on this being fixed (one of the bugs mentions this)
But we’re still discussing API changes, so this is not finished yet.
At the moment, if you add line to a layer, it simply removes everything from the layer.
Workaround is to create a new layer that sits on top, which is only used to render lines.
try depthTest this way (and whichever layer)
app.renderLine(start, end, color, {
layer: uiLayer,
depthTest: true
});
Setting depthTest: false
has the desired effect, many thanks @mvaligursky.
var start = new pc.Vec3(-2, 0.5, 0);
var end = new pc.Vec3(2, 0.5, 0);
var color = new pc.Color(1, 0.5, 0.0);
this.app.renderLine(start, end, color, {
layer: this.app.scene.layers.getLayerByName('Lines'),
depthTest: false
});
Hi guyssssss, thanks.
Hi @vgupgrade! Please don’t share a link without explanation. Your link doesn’t seem to work and leads to a blank page. I have therefore removed the link.