.. role:: clio-readonly
   :class: clio-flag clio-flag-readonly


################
NavigationConfig
################

.. js:class:: cee.NavigationConfig

   Navigation configuration for a view.
   
   Specify how mouse and touch input should be used to navigate the view (move the camera).
   
   Note: To use the right mouse button (either rightMouseButton or leftAndRightMouseButtons), you need to disable the default context menu in the browser (see example below).
   
   **Example on how to configure "Envision style" navigation:**
   
   
   ::
   
      // Disable context menu - Required for enableMouseButtonTracking
      canvas.addEventListener("contextmenu", (event) => { event.preventDefault()});
      
      // Enable mouse tracking (so we can use leftAndRightMouseButtons)
      viewer.enableMouseButtonTracking(true);
      
      // Envision style navigation
      const navConfig = view.navigation.config;
      navConfig.leftMouseButton.noModifier =cee.NavigationType.PAN;
      navConfig.rightMouseButton.noModifier =cee.NavigationType.ROTATE;
      navConfig.leftAndRightMouseButtons.noModifier =cee.NavigationType.WALK;
      navConfig.wheelOrPinch = cee.NavigationType.WALK;
   
   
   Index
   =====
   
   .. rubric:: Properties
   
   
   .. rst-class:: api-xref-list
   
   
   * :js:data:`~cee.NavigationConfig.invertWalkZoom`
   * :js:data:`~cee.NavigationConfig.invertWheel`
   * :js:data:`~cee.NavigationConfig.leftAndRightMouseButtons`
   * :js:data:`~cee.NavigationConfig.leftMouseButton`
   * :js:data:`~cee.NavigationConfig.middleMouseButton`
   * :js:data:`~cee.NavigationConfig.oneFinger`
   * :js:data:`~cee.NavigationConfig.rightMouseButton`
   * :js:data:`~cee.NavigationConfig.twoFinger`
   * :js:data:`~cee.NavigationConfig.wheelOrPinch`
   
   



.. rst-class:: kind-group kind-properties

.. rubric:: Properties
   :class: kind-group-title


.. js:data:: cee.NavigationConfig.invertWalkZoom

      .. rst-class:: sig-pretty-signature
      
         | invertWalkZoom: *boolean*
      
      Invert zoom or walk. If true, camera will zoom out if mouse is moved up
      
      Default is false
      



.. js:data:: cee.NavigationConfig.invertWheel

      .. rst-class:: sig-pretty-signature
      
         | invertWheel: *boolean*
      
      Invert the zoom direction of the mouse wheel
      
      Default is false
      



.. js:data:: cee.NavigationConfig.leftAndRightMouseButtons

      .. rst-class:: clio-flags
      
         :clio-readonly:`readonly`
      
      .. rst-class:: sig-pretty-signature
      
         | leftAndRightMouseButtons: :js:class:`NavigationMouseButtonConfig <cee.NavigationMouseButtonConfig>`
      
      Navigation config when both left and right mouse buttons are pressed.
      
      Default is NONE for all modifier states.
      
      Note: To use the leftAndRightMouseButtons you have to enable mouse tracking in the viewer. See :js:meth:`Viewer.enableMouseButtonTracking <cee.Viewer.enableMouseButtonTracking>`\ . This again requires the browser context menu to be disabled
      



.. js:data:: cee.NavigationConfig.leftMouseButton

      .. rst-class:: clio-flags
      
         :clio-readonly:`readonly`
      
      .. rst-class:: sig-pretty-signature
      
         | leftMouseButton: :js:class:`NavigationMouseButtonConfig <cee.NavigationMouseButtonConfig>`
      
      Navigation config for left mouse button.
      
      Default is
      
      
      - no modifiers -> ROTATE
      - shift pressed -> WALK
      - ctrl or cmd pressed -> PAN
      



.. js:data:: cee.NavigationConfig.middleMouseButton

      .. rst-class:: clio-flags
      
         :clio-readonly:`readonly`
      
      .. rst-class:: sig-pretty-signature
      
         | middleMouseButton: :js:class:`NavigationMouseButtonConfig <cee.NavigationMouseButtonConfig>`
      
      Navigation config for middle mouse button.
      
      Default is NONE for all modifier states.
      



.. js:data:: cee.NavigationConfig.oneFinger

      .. rst-class:: sig-pretty-signature
      
         | oneFinger: :js:data:`NavigationType <cee.NavigationType>`
      
      Navigation type to use for one finger dragging.
      
      Default is ROTATE
      



.. js:data:: cee.NavigationConfig.rightMouseButton

      .. rst-class:: clio-flags
      
         :clio-readonly:`readonly`
      
      .. rst-class:: sig-pretty-signature
      
         | rightMouseButton: :js:class:`NavigationMouseButtonConfig <cee.NavigationMouseButtonConfig>`
      
      Navigation config for right mouse button.
      
      Default is NONE for all modifier states.
      



.. js:data:: cee.NavigationConfig.twoFinger

      .. rst-class:: sig-pretty-signature
      
         | twoFinger: :js:data:`NavigationType <cee.NavigationType>`
      
      Navigation type to use for two finger dragging.
      
      Default is PAN
      



.. js:data:: cee.NavigationConfig.wheelOrPinch

      .. rst-class:: sig-pretty-signature
      
         | wheelOrPinch: :js:data:`NavigationType <cee.NavigationType>`
      
      Navigation type to use for mouse wheel/touch screen pinch events.
      
      Default is WALK
      




