1
1
import 'vtk.js/Sources/favicon' ;
2
2
3
- import vtkFullScreenRenderWindow from 'vtk.js/Sources/Rendering/Misc/FullScreenRenderWindow ' ;
3
+ import Constants from 'vtk.js/Sources/Filters/General/TubeFilter/Constants ' ;
4
4
import vtkActor from 'vtk.js/Sources/Rendering/Core/Actor' ;
5
- // import vtkPointSource from 'vtk.js/Sources/Filters/Sources/PointSource ';
6
- // import vtkOutlineFilter from 'vtk.js/Sources/Filters/General/OutlineFilter ';
5
+ import vtkDataArray from 'vtk.js/Sources/Common/Core/DataArray ' ;
6
+ import vtkFullScreenRenderWindow from 'vtk.js/Sources/Rendering/Misc/FullScreenRenderWindow ' ;
7
7
import vtkMapper from 'vtk.js/Sources/Rendering/Core/Mapper' ;
8
8
import vtkMath from 'vtk.js/Sources/Common/Core/Math' ;
9
- import vtkTubeFilter from 'vtk.js/Sources/Filters/General/TubeFilter' ;
10
9
import vtkPoints from 'vtk.js/Sources/Common/Core/Points' ;
11
10
import vtkPolyData from 'vtk.js/Sources/Common/DataModel/PolyData' ;
12
- import { VtkPointPrecision } from 'vtk.js/Sources/Filters/General/Constants ' ;
11
+ import vtkTubeFilter from 'vtk.js/Sources/Filters/General/TubeFilter ' ;
13
12
import { VtkDataTypes } from 'vtk.js/Sources/Common/Core/DataArray/Constants' ;
13
+ import { VtkPointPrecision } from 'vtk.js/Sources/Filters/General/Constants' ;
14
14
15
15
import controlPanel from './controlPanel.html' ;
16
16
17
+ const { VtkVaryRadius } = Constants ;
18
+
17
19
// ----------------------------------------------------------------------------
18
20
// Standard rendering code setup
19
21
// ----------------------------------------------------------------------------
@@ -43,8 +45,8 @@ function addRepresentation(name, filter, props = {}) {
43
45
global [ `${ name } Mapper` ] = mapper ;
44
46
}
45
47
46
- vtkMath . randomSeed ( 1 ) ;
47
- const numSegments = 2 ;
48
+ vtkMath . randomSeed ( 15222 ) ;
49
+ const numSegments = 3 ;
48
50
49
51
function initializePolyData ( dType ) {
50
52
let pointType = VtkDataTypes . FLOAT ;
@@ -56,43 +58,45 @@ function initializePolyData(dType) {
56
58
const polyData = vtkPolyData . newInstance ( ) ;
57
59
const points = vtkPoints . newInstance ( { dataType : pointType } ) ;
58
60
points . setNumberOfPoints ( numSegments + 1 ) ;
59
- // const pointData = points.getData( );
61
+ const pointData = new Float32Array ( 3 * ( numSegments + 1 ) ) ;
60
62
const verts = new Uint32Array ( 2 * ( numSegments + 1 ) ) ;
61
63
const lines = new Uint32Array ( numSegments + 2 ) ;
62
64
lines [ 0 ] = numSegments + 1 ;
65
+ const scalarsData = new Float32Array ( numSegments + 1 ) ;
66
+ const scalars = vtkDataArray . newInstance (
67
+ { name : 'Scalars' , values : scalarsData } ) ;
63
68
64
- const pointData = [ 0 , 0 , 0 , - 0.13 , - 0.51 , 0 , - 0.41 , - 0.48 , 0 ] ;
65
- points . setData ( pointData ) ;
66
69
for ( let i = 0 ; i < ( numSegments + 1 ) ; ++ i ) {
67
- // for (let j = 0; j < 3; ++j) {
68
- // pointData[(3 * i) + j] = Math.random();
69
- // }
70
+ for ( let j = 0 ; j < 3 ; ++ j ) {
71
+ pointData [ ( 3 * i ) + j ] = vtkMath . random ( ) ;
72
+ }
73
+ scalarsData [ i ] = i * 0.1 ;
70
74
verts [ i ] = 1 ;
71
75
verts [ i + 1 ] = i ;
72
76
lines [ i + 1 ] = i ;
73
77
}
74
78
79
+ points . setData ( pointData ) ;
75
80
polyData . setPoints ( points ) ;
76
- // polyData.getVerts().setData(verts);
81
+ polyData . getVerts ( ) . setData ( verts ) ;
77
82
polyData . getLines ( ) . setData ( lines ) ;
83
+ polyData . getPointData ( ) . setScalars ( scalars ) ;
78
84
return polyData ;
79
85
}
80
86
81
87
// ----------------------------------------------------------------------------
82
88
83
89
84
- // const pointSource = vtkPointSource.newInstance({ numberOfPoints: 25, radius: 0.25 });
85
90
const polyData = initializePolyData ( VtkPointPrecision . DOUBLE ) ;
86
91
const tubeFilter = vtkTubeFilter . newInstance ( ) ;
87
- tubeFilter . setCapping ( true ) ;
88
- tubeFilter . setNumberOfSides ( 30 ) ;
89
- tubeFilter . setRadius ( 0.083 ) ;
90
- tubeFilter . setRadiusFactor ( 10 ) ;
92
+ tubeFilter . setCapping ( false ) ;
93
+ tubeFilter . setNumberOfSides ( 50 ) ;
94
+ tubeFilter . setRadius ( 0.1 ) ;
91
95
92
96
tubeFilter . setInputData ( polyData ) ;
97
+ tubeFilter . setInputArrayToProcess ( 0 , 'Scalars' , 'PointData' , 'Scalars' ) ;
93
98
94
99
addRepresentation ( 'polyData' , polyData , { } ) ;
95
- // addRepresentation('pointSource', pointSource, { pointSize: 5 });
96
100
addRepresentation ( 'tubeFilter' , tubeFilter , { } ) ;
97
101
98
102
renderer . resetCamera ( ) ;
@@ -104,13 +108,31 @@ renderWindow.render();
104
108
105
109
fullScreenRenderer . addController ( controlPanel ) ;
106
110
107
- // ['numberOfPoints', 'radius'].forEach((propertyName) => {
108
- // document.querySelector(`.${propertyName}`).addEventListener('input', (e) => {
109
- // const value = Number(e.target.value);
110
- // pointSource.set({ [propertyName]: value });
111
- // renderWindow.render();
112
- // });
113
- // });
111
+ [ 'numberOfSides' , 'radius' , 'onRatio' ] . forEach ( ( propertyName ) => {
112
+ document . querySelector ( `.${ propertyName } ` ) . addEventListener ( 'input' , ( e ) => {
113
+ const value = Number ( e . target . value ) ;
114
+ tubeFilter . set ( { [ propertyName ] : value } ) ;
115
+ renderWindow . render ( ) ;
116
+ } ) ;
117
+ } ) ;
118
+
119
+ document . querySelector ( '.varyRadius' ) . addEventListener ( 'change' , ( e ) => {
120
+ const value = e . target . value ;
121
+ tubeFilter . set ( { varyRadius : VtkVaryRadius [ value ] } ) ;
122
+ renderWindow . render ( ) ;
123
+ } ) ;
124
+
125
+ document . querySelector ( '.capping' ) . addEventListener ( 'change' , ( e ) => {
126
+ const capping = ! ! ( e . target . checked ) ;
127
+ tubeFilter . set ( { capping } ) ;
128
+ renderWindow . render ( ) ;
129
+ } ) ;
130
+
131
+ document . querySelector ( '.tubing' ) . addEventListener ( 'change' , ( e ) => {
132
+ const tubing = ! ! ( e . target . checked ) ;
133
+ global . tubeFilterActor . setVisibility ( tubing ) ;
134
+ renderWindow . render ( ) ;
135
+ } ) ;
114
136
115
137
// // ----- Console play ground -----
116
138
// global.pointSource = pointSource;
0 commit comments