[Bug] vtkImageCPRMapper: the shader receives the uniform orientation without conversion

オープン 初心者向け
#3,740 コメント 0 件 リアクション 0 件 担当者 0 名 GitHub で見る

メンテナーはふだん 2 日以内に返信

まだ誰も着手していません。

評価

難易度
2/5
見積もり時間
1〜3時間
初心者へのやさしさ
75/100
issue の種類
バグ
明瞭さ
明確に書かれている
活発さ
活発
技術スタック
javascript

調査の方向性

Sources/Rendering/OpenGL/ImageCPRMapper/index.jsの1230行目付近とSources/Rendering/WebGPU/ImageCPRMapper/index.jsの682行目付近を読み、CPUがどこでorientation形式をクォaternionに変換するかを追ってください。既存のImageCPRMapperテストを確認し、quaternion、mat4、mat3、vec3の入力をカバーできる箇所を探してください。対応する各orientation形式が両方のmapperで同じサンプリング方向を生成すれば完了です。

索引モデルが issue の本文から書いたものです。

説明

type: bug 🐞
Bug description

The mapper accepts a uniform orientation as a quaternion, a mat4, a mat3 or a
vec3. The CPU side converts these values to a quaternion. But
Sources/Rendering/OpenGL/ImageCPRMapper/index.js:1230 sends
getUniformOrientation() to the vec4 shader uniform without conversion.
The WebGPU mapper (Sources/Rendering/WebGPU/ImageCPRMapper/index.js:682)
does the same. A mat4, mat3 or vec3 orientation gives a wrong sampling
direction.

Steps to reproduce
  1. Run this code:
import '@kitware/vtk.js/Rendering/Profiles/All';
import { mat4, quat } from 'gl-matrix';
import vtkDataArray from '@kitware/vtk.js/Common/Core/DataArray';
import vtkImageData from '@kitware/vtk.js/Common/DataModel/ImageData';
import vtkPolyData from '@kitware/vtk.js/Common/DataModel/PolyData';
import vtkImageCPRMapper from '@kitware/vtk.js/Rendering/Core/ImageCPRMapper';
import vtkImageSlice from '@kitware/vtk.js/Rendering/Core/ImageSlice';
import vtkRenderer from '@kitware/vtk.js/Rendering/Core/Renderer';
import vtkRenderWindow from '@kitware/vtk.js/Rendering/Core/RenderWindow';

// Render a CPR along z and return the red values of the middle row.
function renderMiddleRow(orientation) {
  // The value increases along y only.
  const values = new Float32Array(64);
  for (let i = 0; i < 64; i++) {
    values[i] = Math.floor(i / 4) % 4;
  }
  const image = vtkImageData.newInstance();
  image.setDimensions(4, 4, 4);
  image.getPointData().setScalars(vtkDataArray.newInstance({ values }));
  const centerline = vtkPolyData.newInstance();
  centerline.getPoints().setData(new Float32Array([1.5, 1.5, 0, 1.5, 1.5, 3]), 3);
  centerline.getLines().setData(new Uint16Array([2, 0, 1]));

  const mapper = vtkImageCPRMapper.newInstance();
  mapper.setUseUniformOrientation(true);
  mapper.setUniformOrientation(orientation);
  mapper.setImageData(image);
  mapper.setCenterlineData(centerline);
  mapper.setWidth(3);

  const actor = vtkImageSlice.newInstance();
  actor.setMapper(mapper);
  actor.getProperty().setColorWindow(3);
  actor.getProperty().setColorLevel(1.5);

  const renderer = vtkRenderer.newInstance();
  renderer.addActor(actor);
  const renderWindow = vtkRenderWindow.newInstance();
  renderWindow.addRenderer(renderer);
  const glWindow = renderWindow.newAPISpecificView('WebGL');
  glWindow.setContainer(document.body.appendChild(document.createElement('div')));
  glWindow.setSize(16, 16);
  renderWindow.addView(glWindow);
  renderer.resetCamera();
  renderWindow.render();
  return Array.from(glWindow.getPixelData(0, 8, 15, 8).filter((v, i) => i % 4 === 0));
}

// The same rotation of 90 degrees about z, as a quaternion and as a mat4.
const q = quat.setAxisAngle(quat.create(), [0, 0, 1], Math.PI / 2);
const m = mat4.fromRotation(mat4.create(), Math.PI / 2, [0, 0, 1]);
console.log('quat', renderMiddleRow(Array.from(q)).join(' '));
console.log('mat4', renderMiddleRow(Array.from(m)).join(' '));
Detailed Behavior

The output is:

quat 0 0 0 0 3 26 50 73 97 120 144 167 191 107 0 0
mat4 0 0 0 85 85 85 85 85 85 85 85 85 85 43 0 0

The quaternion samples along y and shows the gradient. The mat4 is the same
rotation, but the row is constant: the shader samples along a wrong direction.

Expected Behavior

The shader receives the converted quaternion. All the orientation formats
give the same image.

Environment
  • vtk.js version: master (67328bc3ef)
  • Browsers: Chromium (Playwright, Vitest 5 browser mode), WebGL2
  • OS: Windows 11
主要言語
JavaScript
スター
1.5k
フォーク
428
平均マージ
5日 9時間
マージ済み PR(30日)
22

環境構築

はじめの一歩

  1. issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
  2. 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
  3. リポジトリをフォークし、ブランチを切って変更します。
  4. issue 番号を参照したプルリクエストを送ります。

Kitware/vtk-js のほかの issue

Kitware/vtk-js の issue をすべて見る

似ている issue

JavaScript の issue をもっと見る

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。