# Installing ParaViewWeb

**URL:** <https://discourse.paraview.org/t/installing-paraviewweb/8410>\
**Category:** Web Support\
**Created:** [November 15, 2021, 6:16pm UTC](https://discourse.paraview.org/t/installing-paraviewweb/8410 "2021-11-15T18:16:42Z")\
**Posts on this page:** 20\
**Page:** 1

<div class="post-metadata">

**Author:** ![Benjamin-Ousmane](https://discourse.paraview.org/user_avatar/discourse.paraview.org/benjamin-ousmane/32/7945_2.png) [@Benjamin-Ousmane](https://discourse.paraview.org/u/Benjamin-Ousmane)\
**Post date:** [November 15, 2021, 6:16pm UTC](https://discourse.paraview.org/t/installing-paraviewweb/8410/1 "2021-11-15T18:16:42Z")

</div>

Hi,  
I am trying to install ParaViewWeb (on Windows). Here is my issue :

 ![image](https://discourse.paraview.org/uploads/default/original/2X/3/38f5908d76f379a9914d875220300bee9363529e.png)

I tried to run the command in vscode terminal, windows shell and git bash. I also tried to look at my environment variables and install ParaViewWeb directly from source code (with git clone) the same error occurs when I run npm install

node : v14.17.6  
npm@6.14.15

---

<div class="post-metadata">

**Author:** ![jourdain](https://discourse.paraview.org/user_avatar/discourse.paraview.org/jourdain/32/11_2.png) [@jourdain](https://discourse.paraview.org/u/jourdain)\
**Post date:** [November 16, 2021, 12:09am UTC](https://discourse.paraview.org/t/installing-paraviewweb/8410/2 "2021-11-16T00:09:54Z")

</div>

Why do you want to install paraviewweb npm package?

---

<div class="post-metadata">

**Author:** ![simplyvish](https://discourse.paraview.org/letter_avatar_proxy/v4/letter/s/e47774/32.png) [@simplyvish](https://discourse.paraview.org/u/simplyvish)\
**Post date:** [March 21, 2022, 1:27pm UTC](https://discourse.paraview.org/t/installing-paraviewweb/8410/3 "2022-03-21T13:27:35Z")

</div>

Hi, I’m having similar issue. Trying to setup paraviewweb for trying server side rendering with VTK-JS. Any suggestions ?

---

<div class="post-metadata">

**Author:** ![olearypatrick](https://discourse.paraview.org/user_avatar/discourse.paraview.org/olearypatrick/32/9_2.png) [@olearypatrick](https://discourse.paraview.org/u/olearypatrick)\
**Post date:** [March 21, 2022, 1:36pm UTC](https://discourse.paraview.org/t/installing-paraviewweb/8410/4 "2022-03-21T13:36:27Z")

</div>

I would take a look using trame ([https://kitware.github.io/trame/](https://kitware.github.io/trame/)) and explore the tutorial ([https://kitware.github.io/trame/docs/tutorial.html#Tutorial-of-trame](https://kitware.github.io/trame/docs/tutorial.html#Tutorial-of-trame)) with the associated video recording [https://vimeo.com/651667960](https://vimeo.com/651667960).

---

<div class="post-metadata">

**Author:** ![simplyvish](https://discourse.paraview.org/letter_avatar_proxy/v4/letter/s/e47774/32.png) [@simplyvish](https://discourse.paraview.org/u/simplyvish)\
**Post date:** [March 22, 2022, 3:24am UTC](https://discourse.paraview.org/t/installing-paraviewweb/8410/5 "2022-03-22T03:24:15Z")

</div>

Hi @olearypatrick thanks for prompt response. Came across trame before but skipped it. Actually, got confused between the selection of paraviewweb, vtkpython and trame. Right now we have an app in VTK-JS in which we are facing issues if the VTI file is greater than 700MB. So, exploring web side rendering. Can you please help me in selecting the right technology.

---

<div class="post-metadata">

**Author:** ![simplyvish](https://discourse.paraview.org/letter_avatar_proxy/v4/letter/s/e47774/32.png) [@simplyvish](https://discourse.paraview.org/u/simplyvish)\
**Post date:** [March 22, 2022, 5:18am UTC](https://discourse.paraview.org/t/installing-paraviewweb/8410/6 "2022-03-22T05:18:12Z")

</div>

@olearypatrick I checked on trame. It looks like complete development framework to me. As I understood we have to develop whole application using python which will be deployed on server and accessed through browser. We already have developed our application using VTK-JS and in mid-way facing issue with bigger volume files. So we are looking for something which we can incorporate in our existing javascript libraries to handle huge data.

---

<div class="post-metadata">

**Author:** ![jourdain](https://discourse.paraview.org/user_avatar/discourse.paraview.org/jourdain/32/11_2.png) [@jourdain](https://discourse.paraview.org/u/jourdain)\
**Post date:** [March 22, 2022, 4:21pm UTC](https://discourse.paraview.org/t/installing-paraviewweb/8410/7 "2022-03-22T16:21:03Z")

</div>

In which case, you will have to setup the network with wslink and a vtk server to enable remote rendering. You can find an example on how to do it using the vue framework [in that demo project](https://github.com/Kitware/web-project-templates/tree/master/vue-vtkjs-pvw-template). This also provide the server side implementation for either VTK and ParaView.

The example provided above is technically the same thing as [that trame example](https://github.com/Kitware/trame/blob/master/examples/VTK/SimpleCone/RemoteRendering.py).

HTH

---

<div class="post-metadata">

**Author:** ![simplyvish](https://discourse.paraview.org/letter_avatar_proxy/v4/letter/s/e47774/32.png) [@simplyvish](https://discourse.paraview.org/u/simplyvish)\
**Post date:** [March 23, 2022, 6:04am UTC](https://discourse.paraview.org/t/installing-paraviewweb/8410/8 "2022-03-23T06:04:21Z")

</div>

Hi @jourdain, I had tried that vue framework [example](https://github.com/Kitware/web-project-templates/tree/master/vue-vtkjs-pvw-template) but getting following error. Will try the trame example.

( 152.570s) [paraview]vtkWin32OpenGLRenderWin:680 ERR| vtkWin32OpenGLRenderWindow (00000214AA6C4BB0): failed to get wglChoosePixelFormatARB  
( 152.572s) [paraview]vtkWin32OpenGLRenderWin:758 ERR| vtkWin32OpenGLRenderWindow (00000214AA6C4BB0): failed to get valid pixel format.  
( 152.573s) [paraview]vtkOpenGLRenderWindow.c:493 ERR| vtkWin32OpenGLRenderWindow (00000214AA6C4BB0): GLEW could not be initialized: Missing GL version

---

<div class="post-metadata">

**Author:** ![jourdain](https://discourse.paraview.org/user_avatar/discourse.paraview.org/jourdain/32/11_2.png) [@jourdain](https://discourse.paraview.org/u/jourdain)\
**Post date:** [March 23, 2022, 2:56pm UTC](https://discourse.paraview.org/t/installing-paraviewweb/8410/9 "2022-03-23T14:56:43Z")

</div>

Where are you running your server? Do you have a GPU? Do you have the driver (for your GPU) installed? Is your server headless?

---

<div class="post-metadata">

**Author:** ![simplyvish](https://discourse.paraview.org/letter_avatar_proxy/v4/letter/s/e47774/32.png) [@simplyvish](https://discourse.paraview.org/u/simplyvish)\
**Post date:** [March 24, 2022, 12:58pm UTC](https://discourse.paraview.org/t/installing-paraviewweb/8410/10 "2022-03-24T12:58:26Z")

</div>

Currently I’m running it on my development machine only. It has a basic Nvidia Ge Force 210 512 MB graphic card. Drivers are installed for it.  
I also tried trame framework. Able to run the local rendering example. But on running remote rendering example getting same error as for paraviewweb.

```auto

2022-03-24 18:22:42.889 (0.251s) []vtkWin32OpenGLRenderWin:680 ERR| vtkWin32OpenGLRenderWindow (000001671DA21940): failed to get wglChoosePixelFormatARB
2022-03-24 18:22:42.906 (0.268s) []vtkWin32OpenGLRenderWin:758 ERR| vtkWin32OpenGLRenderWindow (000001671DA21940): failed to get valid pixel format.
2022-03-24 18:22:42.909 (0.271s) []vtkOpenGLRenderWindow.c:493 ERR| vtkWin32OpenGLRenderWindow (000001671DA21940): GLEW could not be initialized: Missing GL version

```

---

<div class="post-metadata">

**Author:** ![mwestphal](https://discourse.paraview.org/user_avatar/discourse.paraview.org/mwestphal/32/17_2.png) [@mwestphal](https://discourse.paraview.org/u/mwestphal)\
**Post date:** [March 24, 2022, 3:04pm UTC](https://discourse.paraview.org/t/installing-paraviewweb/8410/11 "2022-03-24T15:04:43Z")

</div>

Hi @simplyvish ,

Please check that your graphic driver is working properly. Using glxinfo and sharing the results would be a first step.

Best,

---

<div class="post-metadata">

**Author:** ![simplyvish](https://discourse.paraview.org/letter_avatar_proxy/v4/letter/s/e47774/32.png) [@simplyvish](https://discourse.paraview.org/u/simplyvish)\
**Post date:** [March 25, 2022, 7:00am UTC](https://discourse.paraview.org/t/installing-paraviewweb/8410/12 "2022-03-25T07:00:07Z")

</div>

Hi @mwestphal ,  
I’m working on Windows-10 platform and glxgears is not present on it. I had used it in past on Cent OS. Checked for Windows but unable to find proper source for setting up.

---

<div class="post-metadata">

**Author:** ![mwestphal](https://discourse.paraview.org/user_avatar/discourse.paraview.org/mwestphal/32/17_2.png) [@mwestphal](https://discourse.paraview.org/u/mwestphal)\
**Post date:** [March 25, 2022, 7:57am UTC](https://discourse.paraview.org/t/installing-paraviewweb/8410/13 "2022-03-25T07:57:22Z")

</div>

You can use dxdiag for that on windows.

You can also use this technique:

> [@Recover OpenGL Informations from pvpython](https://discourse.paraview.org/t/recover-opengl-informations-from-pvpython/1536/4):
>
> [https://gitlab.kitware.com/paraview/paraview/merge\_requests/3320](https://gitlab.kitware.com/paraview/paraview/merge_requests/3320)

---

<div class="post-metadata">

**Author:** ![simplyvish](https://discourse.paraview.org/letter_avatar_proxy/v4/letter/s/e47774/32.png) [@simplyvish](https://discourse.paraview.org/u/simplyvish)\
**Post date:** [March 25, 2022, 2:50pm UTC](https://discourse.paraview.org/t/installing-paraviewweb/8410/14 "2022-03-25T14:50:17Z")

</div>

Hi @mwestphal ,

Please find attached screenshot.

 ![image](https://discourse.paraview.org/uploads/default/original/2X/a/a28cc96340a135088abdf20535dcd260254b4c38.png)

Device Manager:  
 ![image](https://discourse.paraview.org/uploads/default/original/2X/e/e163c05b699c7813909c97e7118af8642bcc6167.png)

---

<div class="post-metadata">

**Author:** ![mwestphal](https://discourse.paraview.org/user_avatar/discourse.paraview.org/mwestphal/32/17_2.png) [@mwestphal](https://discourse.paraview.org/u/mwestphal)\
**Post date:** [March 25, 2022, 2:53pm UTC](https://discourse.paraview.org/t/installing-paraviewweb/8410/15 "2022-03-25T14:53:30Z")

</div>

You are not using your GPU, that why paraview is not able to display anything

---

<div class="post-metadata">

**Author:** ![simplyvish](https://discourse.paraview.org/letter_avatar_proxy/v4/letter/s/e47774/32.png) [@simplyvish](https://discourse.paraview.org/u/simplyvish)\
**Post date:** [March 25, 2022, 3:00pm UTC](https://discourse.paraview.org/t/installing-paraviewweb/8410/16 "2022-03-25T15:00:09Z")

</div>

I’m getting same error in trame as well. However, I’m able to render images on browser using my VTK-JS application. Can you please explain the difference and suggest me some setting for that GPU uses ?

---

<div class="post-metadata">

**Author:** ![jourdain](https://discourse.paraview.org/user_avatar/discourse.paraview.org/jourdain/32/11_2.png) [@jourdain](https://discourse.paraview.org/u/jourdain)\
**Post date:** [March 25, 2022, 5:32pm UTC](https://discourse.paraview.org/t/installing-paraviewweb/8410/17 "2022-03-25T17:32:00Z")

</div>

vtk.js use your browser to do the rendering. Your browser will provide the rendering API regardless of your hardware/software. VTK/ParaView/Trame require your system to have such rendering API available on your machine. This normally happen by installing the proper drivers for your GPU.

Also using Remote Display or VM can mess up access to what get exposed in term of rendering capabilities which will then prevent VTK/ParaView/Trame to produce any 3D rendering.

HTH

---

<div class="post-metadata">

**Author:** ![simplyvish](https://discourse.paraview.org/letter_avatar_proxy/v4/letter/s/e47774/32.png) [@simplyvish](https://discourse.paraview.org/u/simplyvish)\
**Post date:** [March 28, 2022, 2:48am UTC](https://discourse.paraview.org/t/installing-paraviewweb/8410/18 "2022-03-28T02:48:50Z")

</div>

Thanks @jourdain for the explanation. Will try for graphics settings suggested.

---

<div class="post-metadata">

**Author:** ![simplyvish](https://discourse.paraview.org/letter_avatar_proxy/v4/letter/s/e47774/32.png) [@simplyvish](https://discourse.paraview.org/u/simplyvish)\
**Post date:** [March 30, 2022, 7:21am UTC](https://discourse.paraview.org/t/installing-paraviewweb/8410/19 "2022-03-30T07:21:23Z")

</div>

Hi,  
I’m able to run the trame application. I tried the cone example and able to view it in browser. I also tried rendering vti file and loaded it successfully. But, on the browser I can only see a cuboid. I tried the settings done in my VTK-JS application but can’t find all corresponding functions in trame. Do we have some api docs similar to VTK-JS which can be referred. I’m attaching the code below for reference if anyone can suggest what am I missing.

```auto
from tkinter.tix import Tree
from pyparsing import Or
from trame.layouts import SinglePage
from trame.html import vtk, vuetify

from vtkmodules.vtkCommonColor import vtkNamedColors
from vtkmodules.vtkIOXML import vtkXMLImageDataReader
from vtkmodules.vtkRenderingCore import (
    vtkActor,
    vtkDataSetMapper,
    vtkRenderer,
    vtkRenderWindow,
    vtkRenderWindowInteractor,
    vtkRenderedAreaPicker
)
from vtkmodules.vtkFiltersGeometry import vtkGeometryFilter
from vtkmodules.vtkInteractionStyle import vtkInteractorStyleRubberBandPick, vtkInteractorStyleSwitch # noqa
from vtkmodules.vtkInteractionStyle import vtkInteractorStyleSwitch # noqa
import vtkmodules.vtkRenderingOpenGL2 # noqa

CURRENT_DIRECTORY = os.path.abspath(os.path.dirname( __file__ ))

# -----------------------------------------------------------------------------
# VTK pipeline
# -----------------------------------------------------------------------------

renderer = vtkRenderer()
renderWindow = vtkRenderWindow()
renderWindow.AddRenderer(renderer)
renderWindow.SetWindowName('VTI Reader')

renderWindowInteractor = vtkRenderWindowInteractor()
renderWindowInteractor.SetRenderWindow(renderWindow)
renderWindowInteractor.GetInteractorStyle().SetCurrentStyleToTrackballCamera()
renderWindowInteractor.Initialize()

interactorTrackball = renderWindowInteractor.GetInteractorStyle()
interactorSelection = vtkInteractorStyleRubberBandPick()
areaPicker = vtkRenderedAreaPicker()
renderWindowInteractor.SetPicker(areaPicker)

vtiReader = vtkXMLImageDataReader()
vtiReader.SetFileName("head-ascii.vti")
vtiReader.Update()

vtiSource = vtiReader.GetOutput()
scalarRange = vtiSource.GetScalarRange()
sampleDistance = vtiSource.GetSpacing()

surfaceFilter = vtkGeometryFilter()
surfaceFilter.SetInputConnection(vtiReader.GetOutputPort())
surfaceFilter.SetPassThroughPointIds(True)

vtiMapper = vtkDataSetMapper()
vtiMapper.SetInputConnection(surfaceFilter.GetOutputPort())
vtiMapper.SetScalarRange(scalarRange)
vtiMapper.SetScalarVisibility(True)

vtiActor = vtkActor()
vtiActor.SetMapper(vtiMapper)
vtiActor.GetProperty().SetRepresentationToWireframe()
vtiActor.GetProperty().ShadingOn()
vtiActor.GetProperty().SetAmbient(0.2)
vtiActor.GetProperty().SetDiffuse(0.7)
vtiActor.GetProperty().SetSpecular(0.3)
vtiActor.GetProperty().SetSpecularPower(8.0)
vtiActor.GetProperty().SetOpacity(0.5)

colors = vtkNamedColors()

renderer.AddActor(vtiActor)
renderer.ResetCamera()
renderer.SetBackground(colors.GetColor3d('Wheat'))
renderer.ResetCameraClippingRange()
renderWindow.Render()

VTK_VIEW_SETTINGS = {
    "interactive_ratio": 1,
    "interactive_quality": 80,
}

# -----------------------------------------------------------------------------
# GUI
# -----------------------------------------------------------------------------

#html_view = vtk.VtkLocalView(renderWindow)
html_view = vtk.VtkRemoteView(renderWindow)

layout = SinglePage("Volume Viewer", on_ready=html_view.update)
layout.title.set_text("VTI File Viewer")

layout.content.children += [
    vuetify.VContainer(
        fluid=True,
        classes="pa-0 fill-height",
        children=[html_view],
    )
]

# -----------------------------------------------------------------------------
# Main
# -----------------------------------------------------------------------------

if __name__ == " __main__":
    layout.start()

```

The image that is visible on browser is:  
 ![image](https://discourse.paraview.org/uploads/default/original/2X/b/b40d7ae3ba8187949049472abb00aca34c9fca00.jpeg)

---

<div class="post-metadata">

**Author:** ![jourdain](https://discourse.paraview.org/user_avatar/discourse.paraview.org/jourdain/32/11_2.png) [@jourdain](https://discourse.paraview.org/u/jourdain)\
**Post date:** [March 30, 2022, 5:12pm UTC](https://discourse.paraview.org/t/installing-paraviewweb/8410/20 "2022-03-30T17:12:51Z")

</div>

You have the [VTK example web site](https://kitware.github.io/vtk-examples/site/Python/) and more specifically the Python part, but the C++ ones will be similar too.

Then you have the free [VTK Book](https://vtk.org/vtk-textbook/).

[Next page](https://discourse.paraview.org/t/installing-paraviewweb/8410.md?page=2)
