Grid (AG Grid)
Siemens Industrial Experience provides a theme for the popular data grid library AG Grid. This lets you harness the power of AG Grid with seamless integration into the Siemens Industrial Experience styleguide.
AG Grid is a third party library that provides a feature rich data grid implementation.
Its basic functionality is free and open source (distributed under the MIT license).
Please note that more advanced features like e.g. Row Grouping are only available with AG Grid Enterprise which is a commercial product.
More information can be found on the AG Grid licenses page.
Installation
React
Follow the official AG Grid installation instructions for React.
Angular
Follow the official AG Grid installation instructions for Angular.
Vue
Follow the official AG Grid installation instructions for Vue.
Javascript
Follow the official AG Grid installation instruction for JavaScript.
Siemens Industrial Experience theme for AG Grid
Install the @siemens/ix-aggrid package.
npm install @siemens/ix-aggrid
and apply the style file in one of your project's style files e.g. styles.scss
@import '@siemens/ix-aggrid/dist/ix-aggrid/ix-aggrid.css';
Siemens Industrial Experience theming for AG Grid (ag-theme-ix) is based on ag-theme-alpine-dark.
Therefore it is vital to apply the two CSS theme classes in the correct order:
ag-theme-alpine-darkag-theme-ix
e.g.:
<div class="ag-theme-alpine-dark ag-theme-ix"></div>