Solution
- Choose an eligible visualization library
- Embed an HTML control with this library
- Read the 3D data for a material and give it to the library as input

The result is an interactive presentation of the CAD data of the material:

Implementation:

First of all, the data to be visualized must be available in a suitable 3D format. We chose the STL format, a (quasi-)standard format of many CAD systems. The name of the. stl file corresponds to the material number, e. g. "prod01.stl". The file must be stored on a web server, since JavaScript is unable to access the local file system.

Then we create an HTML file, which we load later in the browser control and in which we use a library to display 3D graphics, "three.js" (see Wikipedia) to load the corresponding 3D file of a material and visualize it on the sap screen.

Finally, when you display a material with GuiXT in transaction MM03, we display the browser control and pass the material number to the script as a parameter in the URL:


GuiXT Script:

Box     (10,1)  (29,78)           "3D View (WebGL)"
set V[3dURL] "http://www.synactives10.com/download/webgl/index_e.html?file="
control (10.7,1.6) (26.6,70.1) progID="&V[3dURL]&F[Material]" name="webgl"

You can download all required files for this example here as a .zip file:
Browsercontrol with WebGL (approx. 0.2 MB)

WebGL is only supported by Internet Explorer from version 11!

By default an older version is used when using the IE control. However, you can specify in the GuiXT script which version should be used for the control with the following command:

  // Choose IE11
ProcessingOption ie_browser_emulation=11001

Further details can be found here:
https://weblog.west-wind.com/posts/2011/May/21/Web-Browser-Control-Specifying-the-IE-Version

Components
InputAssistant + Controls