Skip to main content
The React Framework for Qlik Sense Mashups
Charts, Components & Utilities for the rapid creation of custom dashboards off the Qlik Engine
Installation
Install the source files via NPM.
npm install @motor-js/core
Or download our starter dashboard.
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

[object Object]

Powerful Theming

[object Object]

Responsive Charts

[object Object]

Awesome Hooks

[object Object]

Enterprise Support Available

[object Object]

Typescript Support

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