Forum: help

RE: Any tips for less buggy WebGL rendering of textured meshes? [ Reply ]
By: Trevor Davis on 2020-05-27 06:32

* Thanks for taking a look and the suggestions!
* I confirm `textype = "rgb"` removes the rglWebGL bugs in the examples I provided. There are some use cases where I do need support for transparent textures but now that I'm aware of the performance implications I'll try to avoid always using `textype = "rgba"`. I'll allow users to pass in the `textype` argument to my `piece3d` function instead of just defaulting to "rgba" and if it is missing perhaps I'll try to first read in the textures with `png::readPNG` and do a quick check so see if the generated textures actually have any transparent pixels (and if not set to "rgb").
* Merging all the objects into one big object is an interesting idea. I think one could glue all the textures vertically on top of each other "stretching" each individual sub-texture to the same size (i.e. with `grid::grid.raster` supports such width/height distortion and also read in the coordinates of each OBJ file with ``readobj::read.obj`` and with enough manipulation of the various coordinates one could probably get it to work somewhat okay.

RE: Any tips for less buggy WebGL rendering of textured meshes? [ Reply ] By: Duncan Murdoch on 2020-06-03 19:26	[forum:47825]
I've spent a bit of time redoing the rendering of semi-transparent objects, and your example renders properly now. My changes are incomplete, but if you can build rgl from the copy on R-forge, you can try them out.

RE: Any tips for less buggy WebGL rendering of textured meshes? [ Reply ]
By: Duncan Murdoch on 2020-05-27 00:40

[forum:47816]

I took a closer look at the example, and it seems like there isn't an easy solution. The C++ code that does the drawing within R uses a more sophisticated algorithm for drawing: it sorts individual pieces of each rgl object (so objects are drawn in interleaved order), whereas the Javascript code just sorts whole objects, then pieces within each object.

You could get better results if you merged your objects into one big object, but that's hard to do when you have textures: you'd need to glue the textures together too.

You will definitely get better results using `textype = "rgb"`, but maybe that's also not an option for you.

RE: Any tips for less buggy WebGL rendering of textured meshes? [ Reply ]
By: Duncan Murdoch on 2020-05-26 23:26

[forum:47815]

You are using "rgba" for the texture mode, which makes all of the pieces potentially transparent. Transparent surfaces need to be drawn in order, furthest first, closest last; I'd guess that the sort order is reversed, or just not working at all.

A workaround is to switch to "rgb" mode, which relies on OpenGL to hide objects in the background. Drawing order doesn't matter.

If you actually need partial transparency, the sorting issue will need to be addressed. However, I'm not likely to get to it for at least a few days, as I'm in the middle of some other work.

RE: Any tips for less buggy WebGL rendering of textured meshes? [ Reply ] By: Trevor Davis on 2020-05-26 22:52	[forum:47814]
* I successfully upgraded to rgl version 0.101.2 with ``remotes::install_github("rforge/rgl/pgk/rgl")``. * I'm testing the rglWebGL bugs in both Google Chrome and Firefox (but don't observe any major differences in behaviour between the two browsers).

RE: Any tips for less buggy WebGL rendering of textured meshes? [ Reply ]
By: Trevor Davis on 2020-05-26 05:57

[forum:47813]

obj_files_simplified.zip (7) downloads

* A simplified example of a WebGL bug with only 2 textured meshes both of which are fairly straightforward rectangular solids. Zip file of OBJ files and textures is attached to this message.
* "tiles" have been modified so all faces are oriented outwards (confirmed by setting ``back = "culled"`` in the material list).
* When run on my Ubuntu Linux laptop with rgl 0.100.54 the "left" tile fails to "obstruct" the "right" tile in rglWebGL but works fine in RGL device. Oddly when we change the angle to the other side the "right" tile does "obstruct" the "left" tile both in rglWebGL and RGL device.
* I tried to upgrade to a newer version of rgl but ``install.packages("rgl", repos="http://R-Forge.R-project.org")`` would only upgrade me to rgl 0.100.54.

library("rgl")
load_obj <- function(obj_file) {
obj_file <- file.path(tempdir(), obj_file)
png_file <- gsub(".obj$", ".png", obj_file)
material <- list(color = "white", lit = FALSE,
texture = png_file, textype = "rgba",
front = "filled", back = "culled")
mesh <- readOBJ(obj_file, material = material)
invisible(shade3d(mesh))
}

unzip("obj_files_simplified.zip", exdir = tempdir())

open3d()
load_obj("tile_back11.obj")
load_obj("tile_back21.obj")
view3d(theta = -80, phi = 0)

filename <- tempfile(fileext = ".html")
htmlwidgets::saveWidget(rglwidget(), filename)
browseURL(filename)

RE: Any tips for less buggy WebGL rendering of textured meshes? [ Reply ]
By: Trevor Davis on 2020-05-26 01:11

[forum:47812]

webgl_bug.png (13) downloads

* Okay, I'll come up with a more minimal example.
* The ``suppressWarnings`` is only there to suppress an 'Instructions "mtllib", "usemtl" ignored' warning for each OBJ file I import. Wouldn't consider that a bug per se especially since omitting those minimal mtllib/usemtl statements in the OBJ file lead to texture import failures in software using tinyobj (i.e. rayrender). Playing around with "culling" the backs in rgl it seems some of the surfaces in my example were oriented "inwards" and others "outwards" which isn't a problem per se when both faces are "filled" (i.e. RGL device or rayrender) but may be a "bug" if only one side is being "filled".
* However in the former example I was observing WebGL successfully rendering some "front" and some "back" sides. However it seems to be omitting a subset of surfaces entirely and sometimes partially rendering only a subset of some surfaces sometimes omitting an entire fraction of the side (such as rendering only half of the surface) and other times omitting only some of the colors of that surface while continuing to render other colors. Also sometimes (parts of) surfaces that should be blocked from view are visible (perhaps because the blocking surfaces are only being partially rendered).

RE: Any tips for less buggy WebGL rendering of textured meshes? [ Reply ] By: Trevor Davis on 2020-05-25 19:01	[forum:47811]
I also attached the zip file to my initial forum post as an attachment. It seems my web host sometimes blocks the libcurl requests generated by ``download.file`` (trying to get it fixed). Sorry!

RE: Any tips for less buggy WebGL rendering of textured meshes? [ Reply ] By: Duncan Murdoch on 2020-05-25 19:24	[forum:47807]
It looks to me as though the surfaces are being rendered only on one side, and it's choosing the back instead of the front. However, I'm not going to try to debug it: it's far from a minimal example, and "suppressWarnings" makes me think you're doing something buggy to start with. Please simplify it to a minimal example and I'll take a look.

RE: Any tips for less buggy WebGL rendering of textured meshes? [ Reply ]
By: Duncan Murdoch on 2020-05-25 18:57

[forum:47806]

trying URL 'https://trevorldavis.com/share/piecepack/obj_files.zip'
Error in download.file("https://trevorldavis.com/share/piecepack/obj_files.zip", :
cannot open URL 'https://trevorldavis.com/share/piecepack/obj_files.zip'
In addition: Warning message:
In download.file("https://trevorldavis.com/share/piecepack/obj_files.zip", :
cannot open URL 'https://trevorldavis.com/share/piecepack/obj_files.zip': HTTP status was '403 Forbidden'

Any tips for less buggy WebGL rendering of textured meshes? [ Reply ]
By: Trevor Davis on 2020-05-25 18:21

[forum:47805]

obj_files.zip (9) downloads

Hi,

I have some code that imports several OBJ files into rgl as textured meshes. The resulting scene looks good within the RGL device but the rglWebGL output is always buggy with several visible parts of the scene not being rendered. Are there any tips for importing the meshes (or perhaps tweaking the OBJ code itself) that would result in non-buggy WebGL output? I already make sure to slightly shrink the meshes so they don't touch/overlap.

Thanks!

Trevor

# example scene
library("dplyr")
library("htmlwidgets")
library("purrr")
library("rgl")
library("tidyr")

zip_file <- "obj_files.zip"
if (!file.exists(zip_file)) { # obj_files.zip is 150KB
download.file("https://trevorldavis.com/share/piecepack/obj_files.zip", zip_file)
}
unzip(zip_file, exdir = tempdir())
files <- unzip(zip_file, list = TRUE) %>%
arrange(Name) %>%
mutate(ext = tools::file_ext(Name)) %>%
select(Name, ext)
files$id <- rep(seq(nrow(files) / 3), each = 3)
df <- pivot_wider(files, id_cols = id, names_from = ext, values_from = Name)

f <- function(obj, png, ...) {
obj_file <- file.path(tempdir(), obj)
png_file <- file.path(tempdir(), png)
material <- list(color = "white", lit = FALSE, texture = png_file, textype = "rgba")
mesh <- suppressWarnings(rgl::readOBJ(obj_file, material = material))
invisible(rgl::shade3d(mesh))
}

invisible(purrr::pmap(df, f))

filename <- tempfile(fileext = ".html")
htmlwidgets::saveWidget(rglwidget(), filename)
browseURL(filename)