LoadingBar
LoadingBar adds a simple loading bar while loading your 3D model.
import View3D, { LoadingBar } from "@egjs/view3d";
const view3D = new View3D(...);
view3D.loadPlugins(new LoadingBar({
type: "spinner",
loadingLabel: "CUSTOM_LOADING_LABEL"
}));
caution
default and top requires your model served with Content-Length header.
Without it, they won't be displayed correctly.
Types
default
top
spinner
Options
| Option | Type | Default | Description |
|---|---|---|---|
| type | string | "default" | A type(style) of the loading bar. |
| loadingLabel | string | "Loading 3D Model..." | A text to display while loading 3D model. |
| parsingLabel | string | "Parsing 3D Model..." | A text to display while parsing the model after loading is done. |
| labelColor | string | "#ffffff" | A text color in CSS string |
| barWidth | string | "70%" | Loading bar's width in CSS string. This is only applicable for type "default" |
| barHeight | string | "10px" | Loading bar's height in CSS string |
| barBackground | string | "#bbbbbb" | Loading bar's background color in CSS string. This is not applicable to type "spinner" |
| barForeground | string | "#3e8ed0" | Loading bar's foreground color in CSS string |
| spinnerWidth | string | "30%" | Spinner's width in CSS string. This is only applicable for type "spinner" |
| overlayBackground | string | "rgba(0, 0, 0, 0.3)" | Overlay's background color in CSS string. This is not applicable to type "top" |
Assets Used