)
We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: June 24, 2019).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Increase or change the font size on widget header for the maximized view in dashboard viewer

Platform: Dashboard Platform |
Control: Dashboard SDK |
Published Date: April 30, 2018 |
Last Revised Date: May 7, 2019

Methods to increase the font size on widget header of maximized view

To increase the font size of maximized widget header of Dashboard Viewer, use on anyone of the following three methods, by using JavaScript event called ‘actionComplete’.

  • Widget type
  • Widget title
  • Widget ID

 

Widget type

    To increase the font size of maximized widget title based on the widget Type such as chart, grid, etc., use the following code snippet.

$("#dashboard").ejDashboardViewer({  \\ Here dashboard refers to the container      
        serviceUrl: serviceurl,   
        dashboardPath: pathOfDashboardFile,   
        actionComplete: function(args){   
            if(args.eventType === "maximizeDialogOpen"){ //Check the event is Maximized dialog   
                if($(args.source.element[0]).attr("type") === "Chart"){  
                    var maximizetitle = this.currentTabContentElement.find(".e-dbrd-maxControl-title");   
                    maximizetitle.css("font-size","20px");   
                }   
            }   
        },   
    });   

 

Widget title

To increase the font size of the specified title of maximized widget, use the following code snippet.

    $("#dashboard").ejDashboardViewer({  \\ Here dashboard refers to the container      
        serviceUrl: serviceurl,   
        dashboardPath: pathOfDashboardFile,    
        actionComplete: function(args){   
            if(args.eventType === "maximizeDialogOpen"){   //Check the event is Maximized dialog   
                var maximizetitle = this.currentTabContentElement.find(".e-dbrd-maxControl-title");   
                if($(maximizetitle).text() === "Sum of Freight based on Country"){   
                    maximizetitle.css("font-size","20px");   
                }   
            }   
        },   
    });

 

 

 

Widget ID

To increase the font size of the maximized widget title with specified widget ID, use the following code snippet. To get the widget ID using the widget title, refer to the following KB.

https://www.syncfusion.com/kb/8693/how-to-get-the-widget-id-using-the-widget-title-after-rendering-the-dashboard-layout

 

    $("#dashboard").ejDashboardViewer({  \\ Here dashboard refers to the container      
        serviceUrl: serviceurl,   
        dashboardPath: pathOfDashboardFile, 
        actionComplete: function(args){   
            if(args.eventType === "maximizeDialogOpen"){   //Check the event is Maximized dialog   
                if($(args.source.element[0]).attr("id") === "dashboardChart_2_Maximize"){   
                    var maximizetitle = this.currentTabContentElement.find(".e-dbrd-maxControl-title");   
                    maximizetitle.css("font-size","20px");   
                }   
            }   
        },              
    });  

 

The following screenshot illustrates the maximized widget before and after the font size is increased:

Maximized Dashboard after font size change

Maximized Dashboard after font size change

 

ADD COMMENT
You must log in to leave a comment

Please sign in to access our KB

This page will automatically be redirected to the sign-in page in 10 seconds.

Up arrow icon

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon