Home

Totem Code

You only need this lines in order to see the totem.

<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="-20 22 14" rotation="0 30 -10"></a-entity>

        <a-light type="point" intensity="0.7" position="1 30 30"></a-light>

        <a-entity charts='type: totem;  entity_id_list: barId;
            dataPoints_list: {"dataPositive.json": "../data/dataPositive.json", "data.json": "../data/data.json", "dataSmall.json": "../data/dataSmall.json"}'
            position="1 15 10"></a-entity>


        <a-entity movement-controls="fly: true" position="0 30 30" rotation="-24 15 0">
            <a-camera position="4.2 -1 1.5" rotation="0 -1 0">
            </a-camera>;
        </a-entity>
    </a-scene>
</body>

-entity_id_list: Comma separated list of a-entity ID. Only used in totem chart type

-dataPoints_list: Comma separated list of different URL dataPoint. Only used in totem chart type

Check the visual example See our API for Totem options and more