diff --git a/examples/src/Viewer.tsx b/examples/src/Viewer.tsx
index 29a79fd0..6c6ec0d4 100644
--- a/examples/src/Viewer.tsx
+++ b/examples/src/Viewer.tsx
@@ -40,6 +40,7 @@ import PointSimulatorLive from "./simulators/PointSimulatorLive";
 import PdbSimulator from "./simulators/PdbSimulator";
 import SinglePdbSimulator from "./simulators/SinglePdbSimulator";
 import CurveSimulator from "./simulators/CurveSimulator";
+import VolumeSimulator from "./simulators/VolumeSimulator";
 import SingleCurveSimulator from "./simulators/SingleCurveSimulator";
 import ColorPicker from "./ColorPicker";
 import RecordMovieComponent from "./RecordMovieComponent";
@@ -388,16 +389,21 @@ class Viewer extends React.Component<InputParams, ViewerState> {
     public convertFile(obj: Record<string, any>, fileType: TrajectoryType) {
         const fileName = uuidv4() + ".simularium";
         simulariumController
-            .convertTrajectory(this.netConnectionSettings, obj, fileType, fileName)
+            .convertTrajectory(
+                this.netConnectionSettings,
+                obj,
+                fileType,
+                fileName
+            )
             .then(() => {
                 this.clearPendingFile();
             })
             .then(() => {
                 simulariumController.changeFile(
-                    { netConnectionSettings: this.netConnectionSettings, },
+                    { netConnectionSettings: this.netConnectionSettings },
                     fileName,
-                    true,
-                )
+                    true
+                );
             })
             .catch((err) => {
                 console.error(err);
@@ -412,7 +418,7 @@ class Viewer extends React.Component<InputParams, ViewerState> {
         const simulariumFile = fileName.includes(".simularium")
             ? trajectoryFile
             : null;
-        this.setState({ initialPlay: true})
+        this.setState({ initialPlay: true });
         return simulariumController
             .handleFileChange(simulariumFile, fileName, geoAssets)
             .catch(console.log);
@@ -629,6 +635,13 @@ class Viewer extends React.Component<InputParams, ViewerState> {
                 },
                 playbackFile
             );
+        } else if (playbackFile === "TEST_VOLUME") {
+            simulariumController.changeFile(
+                {
+                    clientSimulator: new VolumeSimulator(),
+                },
+                playbackFile
+            );
         } else {
             this.setState({
                 simulariumFile: { name: playbackFile, data: null },
@@ -783,6 +796,7 @@ class Viewer extends React.Component<InputParams, ViewerState> {
                     <option value="TEST_POINTS">TEST POINTS</option>
                     <option value="TEST_METABALLS">TEST METABALLS</option>
                     <option value="TEST_BINDING">TEST BINDING</option>
+                    <option value="TEST_VOLUME">TEST VOLUME</option>
                 </select>
 
                 <button onClick={() => this.translateAgent()}>
diff --git a/examples/src/simulators/PdbSimulator.ts b/examples/src/simulators/PdbSimulator.ts
index 29cff7d7..02bfa796 100644
--- a/examples/src/simulators/PdbSimulator.ts
+++ b/examples/src/simulators/PdbSimulator.ts
@@ -189,7 +189,7 @@ export default class PdbSim implements IClientSimulatorImpl {
                             this.size[0] * this.size[0] +
                                 this.size[1] * this.size[1] +
                                 this.size[2] * this.size[2]
-                        ) * Math.tan(0.5 * FOV_DEGREES * DEGREES_TO_RADIANS),
+                        ) / Math.tan(0.5 * FOV_DEGREES * DEGREES_TO_RADIANS),
                 },
                 lookAtPosition: {
                     x: 0,
diff --git a/examples/src/simulators/SinglePdbSimulator.ts b/examples/src/simulators/SinglePdbSimulator.ts
index 0565642c..ea10cf28 100644
--- a/examples/src/simulators/SinglePdbSimulator.ts
+++ b/examples/src/simulators/SinglePdbSimulator.ts
@@ -89,7 +89,7 @@ export default class PdbSim implements IClientSimulatorImpl {
                             this.size[0] * this.size[0] +
                                 this.size[1] * this.size[1] +
                                 this.size[2] * this.size[2]
-                        ) * Math.tan(0.5 * FOV_DEGREES * DEGREES_TO_RADIANS),
+                        ) / Math.tan(0.5 * FOV_DEGREES * DEGREES_TO_RADIANS),
                 },
                 lookAtPosition: {
                     x: 0,
diff --git a/examples/src/simulators/VolumeSimulator.ts b/examples/src/simulators/VolumeSimulator.ts
new file mode 100644
index 00000000..0542f785
--- /dev/null
+++ b/examples/src/simulators/VolumeSimulator.ts
@@ -0,0 +1,138 @@
+import { GeometryDisplayType } from "../../../src";
+import {
+    IClientSimulatorImpl,
+    ClientMessageEnum,
+} from "../../../src/simularium/localSimulators/IClientSimulatorImpl";
+import {
+    EncodedTypeMapping,
+    TrajectoryFileInfo,
+    VisDataMessage,
+} from "../../../src/simularium/types";
+import VisTypes from "../../../src/simularium/VisTypes";
+
+const FOV_DEGREES = 75;
+const DEGREES_TO_RADIANS = 3.14159265 / 180.0;
+
+export default class VolumeSim implements IClientSimulatorImpl {
+    agentdata: number[];
+    size: [number, number, number];
+
+    constructor() {
+        this.agentdata = [
+            // AGENT 1 ("volume")
+            VisTypes.ID_VIS_TYPE_DEFAULT, // vis type - TODO swap to volume when/if available
+            0, // instance id
+            0, // type
+            0, // x
+            0, // y
+            0, // z
+            0, // rx
+            0, // ry
+            0, // rz
+            10.0, // collision radius
+            0, // subpoints
+
+            // AGENT 2 (sphere, to test volume-mesh intersection)
+            VisTypes.ID_VIS_TYPE_DEFAULT, // vis type
+            1, // instance id
+            1, // type
+            0, // x
+            0, // y
+            6, // z
+            0, // rx
+            0, // ry
+            0, // rz
+            5.0, // collision radius
+            0, // subpoints
+        ];
+        this.size = [25, 25, 25];
+    }
+
+    update(_dt: number): VisDataMessage {
+        return {
+            msgType: ClientMessageEnum.ID_VIS_DATA_ARRIVE,
+            bundleStart: 0,
+            bundleSize: 1, // frames
+            bundleData: [
+                {
+                    data: this.agentdata,
+                    frameNumber: 0,
+                    time: 0,
+                },
+            ],
+            fileName: "hello world",
+        };
+    }
+    getInfo(): TrajectoryFileInfo {
+        const typeMapping: EncodedTypeMapping = {
+            [0]: {
+                name: "volume",
+                geometry: {
+                    // TODO swap with volume display type when available
+                    displayType: GeometryDisplayType.SPHERE,
+                    url: "",
+                    color: "ffff00",
+                },
+            },
+            [1]: {
+                name: "sphere",
+                geometry: {
+                    displayType: GeometryDisplayType.SPHERE,
+                    url: "",
+                    color: "ff0000",
+                },
+            },
+        };
+
+        return {
+            // TODO get msgType and connId out of here
+            connId: "hello world",
+            msgType: ClientMessageEnum.ID_TRAJECTORY_FILE_INFO,
+            version: 3,
+            timeStepSize: 1,
+            totalSteps: 1,
+            size: {
+                x: this.size[0],
+                y: this.size[1],
+                z: this.size[2],
+            },
+            cameraDefault: {
+                position: {
+                    x: 0,
+                    y: 0,
+                    // set a z value that will roughly frame the bounding box within our camera field of view
+                    z:
+                        Math.sqrt(
+                            this.size[0] * this.size[0] +
+                                this.size[1] * this.size[1] +
+                                this.size[2] * this.size[2]
+                        ) / Math.tan(0.5 * FOV_DEGREES * DEGREES_TO_RADIANS),
+                },
+                lookAtPosition: {
+                    x: 0,
+                    y: 0,
+                    z: 0,
+                },
+                upVector: {
+                    x: 0,
+                    y: 1,
+                    z: 0,
+                },
+                fovDegrees: FOV_DEGREES,
+            },
+            typeMapping,
+            spatialUnits: {
+                magnitude: 1,
+                name: "m",
+            },
+            timeUnits: {
+                magnitude: 1,
+                name: "s",
+            },
+        };
+    }
+
+    updateSimulationState(_data: Record<string, unknown>) {
+        // no op
+    }
+}