NlviewJS Live Demos
This page gives an overview on live demos using the powerful NlviewJS engine,
each demonstrating the benefit of Nlview for a specific use case in the EDA
The demos require a customer login - you can get an account
as part of an
Nlview software evaluation.
The NlviewJS demos require an HTML5 capable web browser with
(marked with WASM) of the drawing engine.
(2.5 MB for WebAssembly)
which can take a moment, depending on the speed of your
internet connection. Additionally, for some demos a
double-click may request more data from the web server
(located at concept.de) which triggers network communication.
The desktop and E-engine live demos
are best viewed on workstations and notebooks and require a mouse device.
The mobile live demo is optimized for mobile devices like
smart phones and tablets and includes touch support.
Basic Features (WASM)
This live demo shows some very basic features of NlviewJS and the Nlview core
in general optimized for mobile devices. It allows the user to control NlviewJS
using both a mouse device and/or touch gestures.
E/E Architecture (WASM)
E-engine uses built-in symbols e.g. for ECUs and splices to visualize complex
cable harnesses as they occur in the automotive and aerospace domain.
On the basis of some simple harness designs the E/E architecture
gives an impression of how electronic components can be represented and
interconnected. An incremental mode allows a stepwise exploration of the
currently loaded harness design.
KBL Visualization (WASM)
A server-side parser reads a set of sample
files and fills the EDB database, which is dedicated to store visualization
relevant data of vehicle harness designs
. The web application queries
this database and uses E-engine to display the vehicle harness data. It allows
to search for components and add them to the schematic. Selecting two components
at the same time enables the Path
button which calculates and displays
a shortest path. At each point in time, the vehicle electronics can be explored
incrementally by double-clicking not yet connected cavities/connectors.
Schematic Editing (WASM)
This application demonstrates the editing capabilities
of the Nlview
schematic generation engine. It allows the user to select a symbol from a symbol
library, configure its interface, name and other properties, and then drag and
drop it into the schematic editing canvas. Nets are added interactively by
connecting two pins (resp. one pin and a net) using the mouse.
Design Exploration (WASM)
The top Nlview instance shows the hierarchical view
. A double-click on an
(hierarchical) instance loads its module into the top canvas and its primary
input and output ports into the lower Nlview. There, the current module can then
be incrementally explored
by double-clicking on yet unconnected pins and
not fully expanded (dashed) nets. Additionally, this application demonstrates
advanced features like highlighting, page splitting, the magnify window, and a
This demo shows Nlview's incremental navigation
feature, which allows the
user to explore a design step by step through hierarchy borders. This
application uses the
and starts with an
initial schematic containing the IO ports of the top module. Each double
click on a pin or net loads connected logic from the server database and
integrates the requested data into the current schematic.
CSS Transformation (WASM)
This demo is based on the demo for incremental navigation described above and
shows how CSS transformations
can be used to rotate, scale and skew the
canvas element. A back calculation of the mouse coordinates from the CSS
coordinate space to NlviewJS' coordinate space still allows to use the
incremental features even in transformed mode.
Basic Features (WASM)
The user can start several sub demos each showing selected basic features
of the Nlview schematic generation engine (e.g. folding/unfolding of hierarchy
blocks, path highlighting, page splitting). This demo is the NlviewJS port of
the outdated Java Webdemo.