Skip to content

Commit c060005

Browse files
bruyeretbruyeret
committed
fix(HardwareSelector): Fix tests, Improve example
1 parent 7f8b1c2 commit c060005

File tree

2 files changed

+85
-13
lines changed

2 files changed

+85
-13
lines changed

‎Sources/Rendering/Core/HardwareSelector/example/index.js‎

Lines changed: 31 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,7 @@ import vtkGlyph3DMapper from 'vtk.js/Sources/Rendering/Core/Glyph3DMapper';
1717
import vtkMapper from 'vtk.js/Sources/Rendering/Core/Mapper';
1818
import vtkSphereSource from 'vtk.js/Sources/Filters/Sources/SphereSource';
1919
import vtkCubeSource from 'vtk.js/Sources/Filters/Sources/CubeSource';
20+
import vtkPolydata from 'vtk.js/Sources/Common/DataModel/PolyData';
2021
import vtkMatrixBuilder from 'vtk.js/Sources/Common/Core/MatrixBuilder';
2122
import { mat4 } from 'gl-matrix';
2223
import vtkMath from 'vtk.js/Sources/Common/Core/Math';
@@ -46,7 +47,9 @@ tooltipsElem.style.textAlign = 'center';
4647
const positionTooltipElem = document.createElement('div');
4748
const fieldIdTooltipElem = document.createElement('div');
4849
const compositeIdTooltipElem = document.createElement('div');
50+
const propIdTooltipElem = document.createElement('div');
4951
tooltipsElem.appendChild(positionTooltipElem);
52+
tooltipsElem.appendChild(propIdTooltipElem);
5053
tooltipsElem.appendChild(fieldIdTooltipElem);
5154
tooltipsElem.appendChild(compositeIdTooltipElem);
5255

@@ -95,7 +98,7 @@ const spherePointsSource = vtkSphereSource.newInstance({
9598
radius: 0.6,
9699
});
97100
const spherePointsMapper = vtkMapper.newInstance();
98-
const spherePointsActor = vtkActor.newInstance();
101+
const spherePointsActor = vtkActor.newInstance({ position: [0, -1, 0] });
99102
spherePointsActor.setMapper(spherePointsMapper);
100103
spherePointsMapper.setInputConnection(spherePointsSource.getOutputPort());
101104

@@ -142,6 +145,23 @@ cylinderPointSet.getPointData().addArray(
142145
})
143146
);
144147

148+
// PolyLines -------------------------------------------------
149+
150+
const polyLinesMapper = vtkMapper.newInstance();
151+
const polyLinesData = vtkPolydata.newInstance();
152+
const squarePoints = [-1, 2, 0, 0, 2, 0, 0, 1, 0, -1, 1, 0];
153+
const trianglePoints = [1, 2, 0, 1, 1, 0, 2, 1.5, 0];
154+
polyLinesData
155+
.getPoints()
156+
.setData(Float32Array.from([...squarePoints, ...trianglePoints]), 3);
157+
polyLinesData
158+
.getLines()
159+
.setData(Uint16Array.from([5, 0, 1, 2, 3, 0, 4, 4, 5, 6, 4]));
160+
polyLinesMapper.setInputData(polyLinesData);
161+
162+
const polyLines = vtkActor.newInstance();
163+
polyLines.setMapper(polyLinesMapper);
164+
145165
// ----------------------------------------------------------------------------
146166
// Create Picking pointer
147167
// ----------------------------------------------------------------------------
@@ -172,6 +192,7 @@ renderer.addActor(spherePointsActor);
172192
renderer.addActor(coneActor);
173193
renderer.addActor(cylinderActor);
174194
renderer.addActor(pointerActor);
195+
renderer.addActor(polyLines);
175196

176197
renderer.resetCamera();
177198
renderWindow.render();
@@ -225,12 +246,17 @@ const updateAssociationTooltip = (type, id) => {
225246
}
226247
};
227248

228-
const updateCompositeIdTooltip = (compositeID) => {
249+
const updateCompositeAndPropIdTooltip = (compositeID, propID) => {
229250
if (compositeID !== undefined) {
230251
compositeIdTooltipElem.innerHTML = `Composite ID: ${compositeID}`;
231252
} else {
232253
compositeIdTooltipElem.innerHTML = '';
233254
}
255+
if (propID !== undefined) {
256+
propIdTooltipElem.innerHTML = `Prop ID: ${propID}`;
257+
} else {
258+
propIdTooltipElem.innerHTML = '';
259+
}
234260
};
235261

236262
const updateCursor = (worldPosition) => {
@@ -250,18 +276,19 @@ function processSelections(selections) {
250276
lastProcessedActor = null;
251277
updateAssociationTooltip();
252278
updateCursor();
253-
updateCompositeIdTooltip();
279+
updateCompositeAndPropIdTooltip();
254280
return;
255281
}
256282

257283
const {
258284
worldPosition: rayHitWorldPosition,
259285
compositeID,
260286
prop,
287+
propID,
261288
attributeID,
262289
} = selections[0].getProperties();
263290

264-
updateCompositeIdTooltip(compositeID);
291+
updateCompositeAndPropIdTooltip(compositeID, propID);
265292

266293
let closestCellPointWorldPosition = [...rayHitWorldPosition];
267294
if (attributeID || attributeID === 0) {

‎Sources/Rendering/Core/HardwareSelector/test/testHardwareSelectorPoints.js‎

Lines changed: 54 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import testUtils from 'vtk.js/Sources/Testing/testUtils';
44
import 'vtk.js/Sources/Rendering/Misc/RenderingAPIs';
55
import vtkRenderWindow from 'vtk.js/Sources/Rendering/Core/RenderWindow';
66
import vtkRenderer from 'vtk.js/Sources/Rendering/Core/Renderer';
7+
import vtkPolydata from 'vtk.js/Sources/Common/DataModel/PolyData';
78
import vtkActor from 'vtk.js/Sources/Rendering/Core/Actor';
89
import vtkMapper from 'vtk.js/Sources/Rendering/Core/Mapper';
910
import vtkPlaneSource from 'vtk.js/Sources/Filters/Sources/PlaneSource';
@@ -64,6 +65,25 @@ test.onlyIfWebGL('Test HardwareSelector Points', (tapeContext) => {
6465

6566
renderer.addActor(actor3);
6667

68+
// Square polyline upper left --------------------------------
69+
// Triangle polyline lower right -----------------------------
70+
const mapper4 = gc.registerResource(vtkMapper.newInstance());
71+
const polygon = gc.registerResource(vtkPolydata.newInstance());
72+
const squarePoints = [-0.25, 1.25, 0, 0, 1.25, 0, 0, 1, 0, -0.25, 1, 0];
73+
const trianglePoints = [1, 0, 0, 1, -0.25, 0, 1.25, -0.125, 0];
74+
polygon
75+
.getPoints()
76+
.setData(Float32Array.from([...squarePoints, ...trianglePoints]), 3);
77+
polygon
78+
.getLines()
79+
.setData(Uint16Array.from([5, 0, 1, 2, 3, 0, 4, 4, 5, 6, 4]));
80+
mapper4.setInputData(polygon);
81+
82+
const actor4 = gc.registerResource(vtkActor.newInstance());
83+
actor4.setMapper(mapper4);
84+
85+
renderer.addActor(actor4);
86+
6787
// now create something to view it, in this case webgl
6888
const glwindow = gc.registerResource(renderWindow.newAPISpecificView());
6989
glwindow.setContainer(renderWindowContainer);
@@ -78,43 +98,68 @@ test.onlyIfWebGL('Test HardwareSelector Points', (tapeContext) => {
7898
const promises = [];
7999

80100
// Test picking points
101+
// On a point of the plane
81102
promises.push(
82103
sel.selectAsync(renderer, 210, 199, 211, 200).then((res) => {
83-
tapeContext.ok(res[0].getProperties().propID === 3);
104+
tapeContext.ok(res[0].getProperties().propID === 4);
84105
tapeContext.ok(res[0].getProperties().attributeID === 33);
85106
})
86107
);
87-
108+
// On a point of the lower sphere
88109
promises.push(
89110
sel.selectAsync(renderer, 145, 140, 146, 141).then((res) => {
90-
tapeContext.ok(res[0].getProperties().propID === 4);
111+
tapeContext.ok(res[0].getProperties().propID === 5);
91112
tapeContext.ok(res[0].getProperties().attributeID === 0);
92113
})
93114
);
94-
115+
// On a point of the upper sphere covered by an edge
95116
promises.push(
96117
sel.selectAsync(renderer, 294, 264, 295, 265).then((res) => {
97-
tapeContext.ok(res[0].getProperties().propID === 5);
98-
tapeContext.ok(res[0].getProperties().attributeID === 0);
118+
tapeContext.ok(res[0].getProperties().propID === 6);
119+
tapeContext.ok(res[0].getProperties().attributeID === 2);
99120
})
100121
);
101122

102123
sel.setFieldAssociation(FieldAssociations.FIELD_ASSOCIATION_CELLS);
103124

104125
// Test picking cells
126+
// In the middle of the plane
105127
promises.push(
106128
sel.selectAsync(renderer, 200, 200, 201, 201).then((res) => {
107-
tapeContext.ok(res[0].getProperties().propID === 3);
129+
tapeContext.ok(res[0].getProperties().propID === 4);
108130
tapeContext.ok(res[0].getProperties().attributeID === 27);
109131
})
110132
);
111-
133+
// On a point of the upper sphere covered by some edges
112134
promises.push(
113135
sel.selectAsync(renderer, 265, 265, 266, 266).then((res) => {
114-
tapeContext.ok(res[0].getProperties().propID === 5);
136+
tapeContext.ok(res[0].getProperties().propID === 6);
137+
const attribID = res[0].getProperties().attributeID;
138+
tapeContext.ok(attribID >= 0 && attribID <= 7);
139+
})
140+
);
141+
// On an edge of the upper sphere
142+
promises.push(
143+
sel.selectAsync(renderer, 250, 265, 250, 265).then((res) => {
144+
tapeContext.ok(res[0].getProperties().propID === 6);
145+
const attribID = res[0].getProperties().attributeID;
146+
tapeContext.ok(attribID === 3 || attribID === 4);
147+
})
148+
);
149+
// On a edge of the polyline square
150+
promises.push(
151+
sel.selectAsync(renderer, 133, 278, 133, 278).then((res) => {
152+
tapeContext.ok(res[0].getProperties().propID === 7);
115153
tapeContext.ok(res[0].getProperties().attributeID === 0);
116154
})
117155
);
156+
// On an edge of the polyline triangle
157+
promises.push(
158+
sel.selectAsync(renderer, 265, 128, 265, 128).then((res) => {
159+
tapeContext.ok(res[0].getProperties().propID === 7);
160+
tapeContext.ok(res[0].getProperties().attributeID === 1);
161+
})
162+
);
118163
Promise.all(promises).then(() => {
119164
gc.releaseResources();
120165
});

0 commit comments

Comments
 (0)