Nonstop Progressive Marxism

    TypeScript icon, indicating that this package has built-in type declarations

    6.0.0 • Public • Published


    Build Status

    Sentio JS Provides a JavaScript library for visualizing and analyzing data. Sentio leverages several existing technologies, including D3.js. Now supports D3 v7

    Table of Contents


    Install the package and its peer dependencies via npm:

    npm install d3 @asymmetrik/sentio

    To build from source:

    git clone
    cd sentio
    npm install
    npm run build

    The artifacts will be located in the ./dist dir.


    Sentio is built for consumption using module systems or through global import.

    To import Sentio into the global sentio variable:

    <link rel="stylesheet" href="./node_modules/dist/sentio.css" />
    <script src="./node_modules/d3/dist/d3.js" charset="utf-8"></script>
    <script src="./node_modules/dist/sentio.js" charset="utf-8"></script>

    Otherwise, you can directly import the components of the library if you're using Typescript or ES6 modules.


    Sentio mimics d3's style of using closures to create resources and having shared getter/setter methods.

    The general usage pattern is to create the chart and do some initial configuration:

    var timeline = sentio.chartTimeline()

    Then, you attach the chart to an element on the page, bind data and/or provide series configuration, and call the redraw() method to draw the chart:

    var timelineDiv ='#chart');

    For specific components, refer to the documentation in the source files.

    Chart Types

    • chartTimeline - Static timeline. Allows multiple configurable series, and optional brushing.
    • chartRealtimeTimeline - Realtime timeline. Same as the regular timeline, but it will automatically scroll the timeline at a realtime rate.
    • chartAutoBrushTimeline - Specialized brush timeline that updates its extent automatically in response to changes to the brush.
    • chartDonut - Donut chart. Allows custom color schemes and data series.
    • chartMatrix - Visualize two dimensional data using a matrix heatmap.
    • chartVerticalBars - Stacked bar chart that animates changes to the width of the bars as well as the order of the bars.


    • modelBins - Bin data into configurable bins.
    • controllerRealtimeBins - Manage a bin model for use with the realtime timeline.
    • modelExtent - Configurable manager of the extent of a data series.
    • modelMultiExtent - Aggregate multiple data series with one extent.
    • controllerResponsiveUnits - Generate timeline axis units that match the extent of the timeline.
    • timelineBrush - Helper for managing a brush on a timeline.


    PRs accepted. If you are part of Asymmetrik, please make contributions on feature branches off of the develop branch. If you are outside of Asymmetrik, please fork our repo to make contributions.


    See LICENSE in repository for details.




    npm i @asymmetrik/sentio

    DownloadsWeekly Downloads






    Unpacked Size

    526 kB

    Total Files


    Last publish


    • rblace