🍉 Meet Flexmonster Pivot Table & Charts 2.9.Check out all the hot features!
Get Free Trial

Add new icon in toolbar

swapnil sonkusare asked on September 5, 2019

I am using pivot table in angular 6; so I want to add new icon which doesn’t have in default icon set.

Screenshot (152).png

4 answers

Vera Didenko Vera Didenko Flexmonster September 5, 2019

Thank you for your question.
You can add new icons to new Tabs via the icon property. 
Please see our customizing the Toolbar guide for reference: https://www.flexmonster.com/doc/customizing-toolbar/.
Here is a JSFiddle example for illustration: https://jsfiddle.net/flexmonster/aL1j9hqo/.
The Toolbar is customized using the beforetoolbarcreated event. Please note that in Angular, events are specified in round brackets instead of square brackets.
Please see how events should be defined in app.component.html from our sample project: https://github.com/flexmonster/pivot-angular/blob/master/src/app/app.component.html.
Also please check how the event handlers are specified in app.component.ts: https://github.com/flexmonster/pivot-angular/blob/master/src/app/app.component.ts.
The same approach can be used for the beforetoolbarcreated event.
You are welcome to contact us in case of questions.
Best Regards, 

swapnil sonkusare September 5, 2019

I have already use this approach but there no svg.
so should we create some svg for implementing that because we don’t want url specific img or gif.

Vera Didenko Vera Didenko Flexmonster September 6, 2019

Thank you for your reply.
The icon Tab property is defined in our documentation the following way:
icon – String. The HTML tag containing your custom icon for this new tab. You can choose one of the basic vector icons defined in the flexmonster.toolbar.js file.
You can use Flexmonster’s set of SVG icons defined in the flexmonster.toolbar.js file or use your custom SVG icons.
Please let us know if you have any questions.
Best Regards,

swapnil sonkusare September 9, 2019

It worked I used custom svg string. 

Please login or Register to Submit Answer