- Introduction
- Quick Start
- Background
- Requirements
- Analysis and Visualization
- Built With
- Creator
- License
- My Warehouse Visualizer is a version of My Data Visualizer; develped specfically to aid warehouse/supply chain managers visualize inventory in a WebGL 3D visuals of warehouses.
- The application implements the DataVisual design pattern.
- Like My Data Visualizer, My Warehouse Visualizer is a 100% Client-side application; your data is not uploaded to a server or the cloud.
-
Existing warehouse layouts and inventories can be viewed on the demonstration site or you can dynamically reference newly loaded data as described in the Quick Start section.
The All about warehouse slotting video provides a good overview of one of the supply chain managers best practices for warehouse storage.
My Warehouse Visualizer helps visualize the results of slotting strategies and optimizations.
-
The quickest workflow to visualize a warehouse layout and its inventory is to use data from a Google Sheet.
-
The Small Warehouse Google Sheet contains Layout and Inventory data in separate pages that can be referenced in Comma-separated value format.
-
This sheet was utilized when demonstrating the technical foundation of My Warehouse Visualizer in the Warehouse Visualization With DataVisual Observable notebook.
-
The published CSV Layout data pages are available at the followig URLs:
-
Select CSV URLs... from the Warehouse: drop-down menu:
- Input the two CSV URLs and select the OK button.
- Screen Shot for the loaded Layout and Inventory Data:
Alternatively, the layout and inventory data can be uploaded to My Warehouse Visualizer. Several sample files are provided in the data folder:
- Select Upload... from the Warehouse: drop-down menu:
- Select layout and inventory files to upload. The filenames must contain the text 'layout' and 'inventory' in their names to distinguish them. The files can be dragged-and-dropped onto the page or selected from a file dialog.
- Screen Shot for the loaded Layout and Inventory Data:
Both My Data Visualizer and My Warehouse Visualizer were developed to add an important dimension to data visualization; WebGL 3D graphics.
With My Warehouse Visualizer, inventory data is contextualized on a 3D graphic representation of a warehouse layout.
The following Computational Essay hosted on ObservableHQ.com provides a technical background on the design approach for My Warehouse Visualizer:
My Warehouse Visualizer requires:
-
A warehouse layout file that specifies the the dimensions and locations of the storage slots.
-
An inventory file that details what items are stored in the storage slots.
-
The data to be visualized must be in a Comma-separated format.
- Several sample files are available for review in the data folder.
-
When loaded, the data are parsed with the D3 AutoType parser.
- Any column name that is prefixed with a '\s' instructs the parser to override the D3 AutoType parser and treat the columns contents as a string. An example of this in the sample data is the \sITEM NO column in the sample invetory files.
At a minimum, the Layout data must have the following columns of data:
| Column Name | Notes |
|---|---|
| LOCATION | A unique identifier for a slot. 'LOCATION' is also a column in the Inventory dataset. |
| WIDTH | A numeric value representing the width of an individual slot. |
| DEPTH | A numeric value representing the depth of an individual slot. |
| HEIGHT | A numeric value representing the height of an individual slot. |
| X | A numeric value representing the X coordinate of an individual slot. |
| Y | A numeric value representing the Y coordinate of an individual slot. |
| Z | A numeric value representing the Z coordinate of an individual slot. |
| AISLE | An aisle identifier for the slot. |
| CENTERAXIS | Contains either a value of 'X' or 'Y' to instruct the application as to which axis the relative 'AISLE' is oriented on. |
| BAY | A unique identifier for a collection of 'LOCATION' slots. |
At a minimum, the Inventory data must have the following columns of data:
| Column Name | Notes |
|---|---|
| LOCATION | A unique identifier for a slot. 'LOCATION' is also a column in the Inventory dataset. |
The following table summarizes the data attributes supported by My Warehouse Visualizer for data hosted in the Comma-separated format datasets:
| Attribute | Description |
|---|---|
| dimension | An attribute identifier for a dimension(s). Examples: 'LOCATION', 'AISLE', 'BAY', '\sITEM NO'; see '\s' prefix below. |
| measure | An attribute identifier for a measure(s). Example: 'ITEM WGT', 'WEEKLY MVMT', 'ITEM COST'. |
| COLOR_dimension, COLOR_measure | An indentifier with the 'COLOR_' prefix designates a pre-defined color attribute for a given measure or dimension. Values can be any CSS color name or hex triple value. |
| DATE_dimension, DATETIME_dimension, TIME_dimension | An attriute identifier for an ECMA Script formatted date specified as a dimension . The 'DATE_', 'DATETIME_' and 'TIME_' prefixes designate the data as a JavaScript Date. |
| LINK_ | An attribute identifier for optional HyperLinks associated with name column values. At run-time, My Warehouse Visualizer will append the name column value to the 'LINK_' column value and instruct the browser to navigate to that url. |
| \s | An attribute identifier that instructs the data load parser to override the D3 AutoType parser and treat the columns contents as a string. |
-
Once Layout and Inventory data have been loaded, the analysis and visualization functionality is similar to My Data Visualizer.
-
Detail documentation can be found at https://github.com/MarioDelgadoSr/MyDataVisualizerDoc#analysis;
The following frameworks and applications were used to build My Warehouse Visualizer:
- D3.js - D3 framework
- Three.js - Three.js framework
- w2ui UI Library
- Mario Delgado Github: MarioDelgadoSr
- LinkedIn: Mario Delgado
- My Data Visualizer: A data visualization application using the DataVisual design pattern.
- Contact: MyDataVisualizer(at)gmail.com.
- My Data Visualizer and My Warehouse Visualizer are free for all non-profit entities.
- Businesses and commercial enterprises are granted full use license as long as they make their application freely available to non-profits.