Tss-img-lib NPM

Install the package using the following command

npm i tss-img-lib

After installing declare the img-lib module in app.module.ts

import {ImgLibModule} from 'tss-img-lib';

You need to download primeng and font-awesome node modules from npm if it is not installed in your project. The commands for installing primeng and font-awesome

npm install primeng --save
npm install font-awesome --save

If primeng and font-awesome are already installed then import the following in app.module.ts

import {DialogModule} from 'primeng/dialog';
import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
import {ButtonModule} from 'primeng/button';

After importing all the modules in app.module.ts make sure they are imported in Imports tag in @NgModule

Now in-order to use the img-lib module to display the image send the options array by calling the selector in the required html tag in the following way

<lib-view [options]="options"></lib-view>

In options variable send the required option like source,height,width etc.The following options you can send and based on the data the image will render

The options variable show be binded to Imageproperties interface by the following declarations

options: Imageproperties;

It is imported in the following way

import { Imageproperties } from 'tss-img-lib/lib/view/imageproperties';

The options json is

this.options={ id:number source:string description:string width:number height:number positionX:number positionY:number className:string style:string dataset:any datasetColumn:any alternateText:any rollOverimage:any rollOverStyle:any html:any code:any opacity:number link:string hasTooltip (yes|no):any tooltip (tooltip text come here...):any }