fix(Informations): Add GPU name

Sources/controls/Informations/Informations.mcss

@@ -67,3 +67,10 @@
   justify-content: space-around;
   padding: 10px 5px 20px 5px;
 }
+
+.textContent {
+  position: relative;
+  top: -5px;
+  padding: 10px 0;
+  text-align: center;
+}

Sources/controls/Informations/index.js

@@ -12,15 +12,38 @@ import style from './Informations.mcss';
 const hasVR = !!navigator.getVRDisplays;
 
 export default function Informations(props) {
-  const output = [
-    <label className={style.title} key="title-perf">
-      Performance monitor
-    </label>,
-    <FPSMonitor key="fps" proxyManager={props.proxyManager} />,
-  ];
+  const output = [<br key="space-head" />];
   const source = props.proxyManager.getActiveSource();
+  const view = props.proxyManager.getActiveView();
   const dataset = source ? source.getDataset() : null;
 
+  // GPU data
+  if (view) {
+    const rw = view.getOpenglRenderWindow();
+    const allInfo = rw.getGLInformations();
+    const { UNMASKED_RENDERER, UNMASKED_VENDOR, WEBGL_VERSION } = allInfo;
+
+    output.push(
+      <label className={style.title} key="gpu">
+        {UNMASKED_VENDOR.value}
+      </label>
+    );
+    output.push(
+      <div className={style.textContent}>
+        {UNMASKED_RENDERER.value}
+        <br />WebGL {WEBGL_VERSION.value}
+      </div>
+    );
+  }
+
+  // Perf monitor
+  output.push(
+    <label className={style.title} key="title-perf">
+      Performance monitor
+    </label>
+  );
+  output.push(<FPSMonitor key="fps" proxyManager={props.proxyManager} />);
+
   if (hasVR) {
     output.push(
       <label className={style.title} key="title-vr">

package.json

@@ -21,7 +21,7 @@
         "rc-dropdown": "^2.1.0",
         "rc-progress": "^2.2.5",
         "shelljs": "0.7.8",
-        "vtk.js": "6.3.11"
+        "vtk.js": "6.3.14"
     },
     "devDependencies": {
         "@fortawesome/fontawesome-free-webfonts": "^1.0.4",