The React Framework for Qlik Sense Mashups
Charts, Components & Utilities for the rapid creation of custom dashboards off the Qlik Engine
Get StartedContact Us
Installation
Install the source files via NPM.
npm install @motor-js/core
Or download our starter dashboard.
Download
Usage
Connect to your Qlik site through our Motor component and then use the components without any additional setup.
import { Filter, Motor } from '@motor-js/core'
<Motor 
  config={ /* Connect to your Qlik site */ }
  theme={ /* Theme your Mashup */ }
>
  //...
  <Filter dimension=['AwesomeDimension'] />
  //...
</Motor>
Reasons you'll love motor
[object Object]

Free and Open Source

Motor js is free, provided on the Apache 2.0 license. Just install from npm, connect to a Qlik engine and start building.

[object Object]

Powerful Theming

Tailor the library to your needs. Control color, styles and layouts through our easy to use theme object.

[object Object]

Responsive Charts

Charts, Components and Layouts are responsive, supporting all screen sizes.

[object Object]

Awesome Hooks

Re-usable hooks to speed up the development of your custom dashboards.

[object Object]

Enterprise Support Available

We offer a supported version of the library for Enterprise projects.

[object Object]

Typescript Support

Out of the box support for Typescript.

We are adding features and would love your feedback!
Get in touch via chat or on Spectrum
View Community
Custom Charts Powered by the Engine
Motor js' charts are fully customisable through our theme object. We also support the Capability APIs for quick and easy embedding in your React project
import { Motor, Bar, Filter } from '@motor-js/core'
<Motor 
  config={ /* Connect to your Qlik site */ }
  theme={{
    global: {
      color: { brand: 'blue' },
      chart: {
        gridStyles: { 
          rows: { 
            stroke: '#EDEDED',
            strokeDasharray: 0,
            numTicks: 6
          },
          columns: { stroke: 'none' },
        },
        yTickStyles: { stroke: 'none' }
      }
    },
  }} 
>
  //...
  <Filter dimension={['Month']} />
  <Bar 
    width={800}
    height={350}
    colorTheme='divergent13'
    showLegend={false}
    showLabels={false}
    numMeasureTicks={6}
    stacked
    cols={[
      { 
        qField: '[Month]', 
        qLabel: 'Month'
      },
      { 
        qField: '[Product Group Desc]',
        qLabel: 'Product Group'
      },
      { 
        qField: '=sum([Sales Amount])',
        qLabel: 'Sales'
      },
    ]}
  />
  //...
</Motor>
loading...
Need to build a custom Qlik solution?
Contact Us