Resize makes objects dissapear, but some - still renders

Armory Engine
1

Hello.

How to properly resize app/canvas (webGL build)?

I use this way:

var canvas = kha.SystemImpl.khanvas;
var window = Window.get(0);

if (canvas != null) {
	// Use CSS size to drive resizing and let SystemImpl's automatic
	// adjustment update the actual backbuffer size on the next frame.
	var scale = js.Browser.window.devicePixelRatio;
	if (scale <= 0) scale = 1.0;
	var cssW = Std.int(width / scale);
	var cssH = Std.int(height / scale);
	canvas.style.width = cssW + "px";
	canvas.style.height = cssH + "px";
}

// Notify Kha/Armory about the logical size change so any resize
// callbacks (App, render path, cameras, etc.) can react properly.
if (window != null) {
	window.mode = kha.WindowMode.Windowed;
	window.resize(width, height);
}

this resizes canvas - ok, but all scene objects dissapeared. only still renders environment HDR and overlay objects

This related to make correct frame capturing.

I use notifyOnRender(function(g:kha.graphics4.Graphics)

created render target 2k * 2k
inside i tested 2 approaches:

function renderCameraIntoTarget(camera:CameraObject, target:kha.Image) {
	var targetGraphics = target.g4;
	camera.renderFrame(targetGraphics);
}

it`s ok - but app should be same size (2k * 2k) - otherwise - incorrect images (with black sides) so i need to resize app before make screenshot to render target

other way:

function renderCameraByGraphics(camera:CameraObject, target:kha.Image, targetGraphics:kha.graphics4.Graphics) {
	var oldRT = camera.renderTarget;
	camera.renderTarget = target;
	camera.renderFrame(targetGraphics);
	camera.renderTarget = oldRT;
}

this makes images different from that renders on canvas

on canvas:

image
image1920×1175 274 KB

in render target:

image
image1920×1160 246 KB

btw - some part of this panorama box can rendere incorrect also with screen space reflections, depend on camera orientation

i try to capture panorama box. i know camera has renderTargetCube - but it`s too complex use it.

i just want make panorama shot (box with 6 sides)

2

Can you explain what are you trying to achieve like the scope?

3

I try make panorama images for box 6 sides. from hires scene and use it in lowres scene.

panorama resolution can be different from current browser canvas size - so i used render targets to capture rendering. but is has issues, it differs from that you see on screen.

another approach also uses render targets but it also requires current canvas size to be same size to render targets. and resize also bugging…

4

If you use window mode and set the render resolution size your camera will have that resolution. The rendertarget can have a different size if you want but you need to preserve the aspect ratio. You can then use all that image or a subimage to save as an exported image.

Are you using perspective or ortographic camera?

It seems chaning the kha.windows size and mode with code is not possible at least there is not evidence someone has achieved that.

5

it almost works (resize) scene environment hdr and objects with material ‘overlay’ still visible on scene - others - dissapears.

i use perspective camera. changing aspect ratio to make quad images

6

Well others use depth, overlay does not it is a different pass where the objects are like 2d renders. I haven’t use perspective camera I will need to test if it works too. But what happens if you try it with ortographic?

But why do you need to do a resize?

I am still not getting your scope.

7

use orthographics in panoramas shoting or for resize?

only combination canvas size === render target size - normal screenshots by using:

function renderCameraIntoTarget(camera:CameraObject, target:kha.Image) {
	var targetGraphics = target.g4;
	camera.renderFrame(targetGraphics);
}

i need make 6 images in cube sides for panorama. so i place camera to cube center, apply cube transform, then rotate camera to look face centers and shoting by renderCameraIntoTarget

8

something like this in blender:

image
image509×522 47.6 KB

using cubemap in armory:

image
image1491×375 16.4 KB

custom camera rotation:

image
image1402×381 20.2 KB

if it is not something like this then I give up.

9

i thought about use cubemap render target instead of 6 render targets. but i do not know how to render it then. on cube/sphere via materail?

how u render images in top?

10

btw! finally! i fixed resize by removing some objects with materials with some armory properties and it works now