Vtk. js JSON data to create mesh

Hi,I want the JSON data to be rendered via vtk.js:
The format of the data model is Stp.
I get the data through OCCT meshing and put it in JSON format.
The STP format is similar to the STL format.So,I read the binary source code according to STLReader to modify.

I was able to render some simple models (around 60 triangles), but more complex models would have missing triangles.

Give me some advice on how to proceed or how to render an STP file with VTK.
Thanks for your help!

This is the code that reads data into Polydata:

   //keep track of the number of triangles
    var allTriLength = 0;
    var pointValues = new Float32Array(numTriangles * 9);
    var normalValues = new Float32Array(numTriangles * 3);
    var cellValues = new Uint32Array(numTriangles * 4);
    var cellDataValues = new Uint16Array(numTriangles);
    var cellOffset = 0;
    //read data
    for (var faceIdx = 0; faceIdx < faceLength; faceIdx++) {

      let triOfFaceLength = jsondata.face_list[faceIdx].number_of_triangles
      points.setNumberOfPoints(triOfFaceLength*3);
      for(let triIndex =0;triIndex < triOfFaceLength;triIndex++){
        // x1
        pointValues[allTriLength * 9 + 0] = jsondata.face_list[faceIdx].tri_vertex_coord[0 + (triIndex * 9)];
        // y1
        pointValues[allTriLength * 9 + 1] = jsondata.face_list[faceIdx].tri_vertex_coord[1 + (triIndex * 9)];
        // z1
        pointValues[allTriLength * 9 + 2] = jsondata.face_list[faceIdx].tri_vertex_coord[2 + (triIndex * 9)];
        // x2
        pointValues[allTriLength * 9 + 3] = jsondata.face_list[faceIdx].tri_vertex_coord[3 + (triIndex * 9)];
        // y2
        pointValues[allTriLength * 9 + 4] = jsondata.face_list[faceIdx].tri_vertex_coord[4 + (triIndex * 9)];
        // z2
        pointValues[allTriLength * 9 + 5] = jsondata.face_list[faceIdx].tri_vertex_coord[5 + (triIndex * 9)];
        // x3
        pointValues[allTriLength * 9 + 6] = jsondata.face_list[faceIdx].tri_vertex_coord[6 + (triIndex * 9)];
        // y3
        pointValues[allTriLength * 9 + 7] = jsondata.face_list[faceIdx].tri_vertex_coord[7 + (triIndex * 9)];
        // z3
        pointValues[allTriLength * 9 + 8] = jsondata.face_list[faceIdx].tri_vertex_coord[8 + (triIndex * 9)];
        // Normal
        let normalValue = getNormal(pointValues[allTriLength * 9 + 0],
                                    pointValues[allTriLength * 9 + 1],
                                    pointValues[allTriLength * 9 + 2],
                                    pointValues[allTriLength * 9 + 3],
                                    pointValues[allTriLength * 9 + 4],
                                    pointValues[allTriLength * 9 + 5],
                                    pointValues[allTriLength * 9 + 6],
                                    pointValues[allTriLength * 9 + 7],
                                    pointValues[allTriLength * 9 + 8]);
        normalValues[allTriLength * 3 + 0] = normalValue[0];
        normalValues[allTriLength * 3 + 1] = normalValue[1];
        normalValues[allTriLength * 3 + 2] = normalValue[2];
       
        cellValues[cellOffset++] = 3;
        cellValues[cellOffset++] = allTriLength * 3 + 0;
        cellValues[cellOffset++] = allTriLength * 3 + 1;
        cellValues[cellOffset++] = allTriLength * 3 + 2;
        cellDataValues[allTriLength] = 0;
        allTriLength++;
      }
    }
    console.log("polydata::",polydata);

    polydata.getPoints().setData(pointValues, 3);

    polydata.getPolys().setData(cellValues);

    polydata.getCellData().setScalars(vtkDataArray.newInstance({
      name: 'Attribute',
      values: cellDataValues
    }));
    polydata.getCellData().setNormals(vtkDataArray.newInstance({
      name: 'Normals',
      values: normalValues,
      numberOfComponents: 3
    })); // Add new output

I can render step file through C++ VTK, but the methods I used in VTK are not working/supported in vtk.js.

for (faceExplorer.Init(shape_Step, TopAbs_FACE); faceExplorer.More(); faceExplorer.Next())
	{
		
		TopLoc_Location loc;
		TopoDS_Face aFace = TopoDS::Face(faceExplorer.Current());

		Handle_Poly_Triangulation triFace = BRep_Tool::Triangulation(aFace, loc);
		Standard_Integer nTriangles = triFace->NbTriangles();
		allTriangles += nTriangles;
		
		gp_Pnt vertex1;
		gp_Pnt vertex2;
		gp_Pnt vertex3;
		//
		Standard_Integer nVertexIndex1 = 0;
		Standard_Integer nVertexIndex2 = 0;
		Standard_Integer nVertexIndex3 = 0;

		TColgp_Array1OfPnt nodes(1, triFace->NbNodes());
		Poly_Array1OfTriangle triangles(1, triFace->NbTriangles());
		
		nodes = triFace->Nodes();
	
		triangles = triFace->Triangles();
		
		vtkSmartPointer<vtkPoints> points = vtkSmartPointer<vtkPoints>::New();
	
		vtkSmartPointer<vtkCellArray> cells = vtkSmartPointer<vtkCellArray>::New();

		vtkSmartPointer<vtkPolyData> polyData = vtkSmartPointer<vtkPolyData>::New();
		cout<<"nTriangles::" << nTriangles << endl;
		points->Allocate(nTriangles * 3);
		cells->Allocate(nTriangles);

		int id = 0;

		for (Standard_Integer i = 1; i <= nTriangles; i++)
		{
			Poly_Triangle aTriangle = triangles.Value(i);

			aTriangle.Get(nVertexIndex1, nVertexIndex2, nVertexIndex3);
			//Get vertex
			vertex1 = nodes.Value(nVertexIndex1).Transformed(loc.Transformation());
			vertex2 = nodes.Value(nVertexIndex2).Transformed(loc.Transformation());
			vertex3 = nodes.Value(nVertexIndex3).Transformed(loc.Transformation());
			//vertex1 = nodes.Value(nVertexIndex1);
			//vertex2 = nodes.Value(nVertexIndex2);
			//vertex3 = nodes.Value(nVertexIndex3);

			
			points->InsertNextPoint(vertex1.X(), vertex1.Y(), vertex1.Z());//ID=0;
			points->InsertNextPoint(vertex2.X(), vertex2.Y(), vertex2.Z());//ID=1
			points->InsertNextPoint(vertex3.X(), vertex3.Y(), vertex3.Z());//ID=2
			
			vtkSmartPointer<vtkTriangle> triangle = vtkSmartPointer<vtkTriangle>::New();
			triangle->GetPointIds()->SetId(0, id * 3);
			triangle->GetPointIds()->SetId(1, id * 3 + 1);
			triangle->GetPointIds()->SetId(2, id * 3 + 2);
			// Add the triangle to a cell array--
			cells->InsertNextCell(triangle);
			id++;
		}
		polyData->SetPoints(points);
		polyData->SetPolys(cells);

		vtkSmartPointer<vtkPolyDataMapper> sourceMapper = vtkSmartPointer<vtkPolyDataMapper>::New();
		sourceMapper->SetInputData(polyData);

		vtkSmartPointer<vtkActor> sourceActor = vtkSmartPointer<vtkActor>::New();
		sourceActor->SetMapper(sourceMapper);
		sourceActor->GetProperty()->SetColor(1, 0, 0);

		renderer->AddActor(sourceActor);
	};

Your best bet is to use an external utility or library to triangulate your step files. vtk.js does not provide such triangulation yet, even though VTK does.

Thank you

Thanks for your help, I got it done. The method is: the corresponding vertex order is obtained through the measurement of the triangle in OCCT, and the rendering can be performed normally.