You only need this lines in order to see the museum.
<head>
<title>My A-Frame Scene</title>
<script src="https://aframe.io/releases/1.4.0/aframe.min.js"></script>
<script src="https://unpkg.com/aframe-charts-component/dist/aframe-charts-component.min.js"></script>
</head>
<body>
<!-- Aframe scene -->
<a-scene background="color: grey" cursor="rayOrigin:mouse"> <!-- Cursor mouse clickable. -->
<a-light type="point" intensity="1" position="-2 10 10"></a-light>
<a-entity id="barId" charts="type: bar; dataPoints: ../data/dataPositive.json" position="-50 0 10" rotation="0 30 -10"></a-entity>
<a-entity id="bubbleId" charts="type: bubble; dataPoints: ../data/dataPositive.json" position="-25 15 0" rotation="0 20 -10"></a-entity>
<a-entity id="pieId" charts="type: pie; dataPoints: ../data/dataPositive.json; pie_radius: 5" position="-5 0 -20"></a-entity>
<a-entity id="cylinderId" charts="type: cylinder; dataPoints: ../data/dataPositive.json" position="12 17 -5" rotation="0 -20 10"></a-entity>
<a-entity id="pieDoughnutId" charts="type: pie; dataPoints: ../data/dataPositive.json; pie_radius: 5; pie_doughnut: true" position="35 0 -10"></a-entity>
<a-light type="point" intensity="0.7" position="1 30 30"></a-light>
<a-entity position="1 15 10" charts='type: totem; entity_id_list: barId,bubbleId,pieId,cylinderId,pieDoughnutId;
dataPoints_list: {"dataPositive.json": "../data/dataPositive.json", "data.json": "../data/data.json","dataSmall.json": "../data/dataSmall.json"}'>
</a-entity>
<a-entity movement-controls="fly: true" position="0 30 30" rotation="-24 15 0"> <!-- Camera fly movement. -->
<a-camera position="4.2 -1 1.5" rotation="0 -1 0">
</a-camera>
<a-entity laser-controls="hand: right"></a-entity> <!-- Control for Oculus Rift. -->
</a-entity>
</a-scene>
</body>
Check the visual example
See our API for Totem options and more