Branding PNG Downloads - SuperWEB2

Users can also download a graph as a PNG image. You can make some changes to this format by editing one of the SuperWEB2 template files.

1. Open the file <tomcat_home>\webapps\webapi\graphViewTab.jsp in a text editor.
   
   

   Make a backup copy of this file before making any changes.

2. Locate the following section of the file:

   XML

   <charting-wc:downloadChartPNG
                downloadid="cdataonline_png_test"
                stringseparator=";"
                arrayseparator="|"
                messagekey="mapView.download.png"
                imgs="STR-light-background.png"
                imgcoords="0;0"
                imgborders="0"
                margin="5"
                texts="#{tableBean.tableDataModel.databaseDisplayName}"
                textcoords="126;30|126;48|126;68|540;1160"
                textformats="16;Bold;Arial|12;Bold;Arial|12;Bold;Arial|10;Plain;Arial"
                chartimgx="0"
                chartimgy="110"
                chartimgsizex="1280"
                chartimgsizey="1024"
                chartborder="1"/>

3. There are a number of changes you can make to these parameters:

   Parameter	Defines
   imgs	A logo or other image to be inserted onto the image. The image file must be saved to <tomcat_home>\webapps\webapi\images\
   imgcoords	The x and y coordinates to place the logo, separated by a semi-colon. "0;0" specifies that the logo will be placed in the top left corner of the PNG.
   imgborders	The logo border width (in pixels). Set this to 0 if you do not want to use a border on the logo image.
   texts	Up to four lines of text to be placed on the image. Separate each text string with a semi-colon. The default value of this string is #{tableBean.tableDataModel.databaseDisplayName}, which will be replaced with the database display name.
   textcoords	The x and y coordinates of each of the four text strings. Each set of coordinates is separated with a | character.
   textformats	The text size, weight and font for each of the four text strings (separated with a | character).
   chartimgx	The x coordinate of the top left of the graph image.
   chartimgy	The y coordinate for the top left of the graph image.
   chartimgsizex	The width of the graph image in pixels.
   chartimgsizey	The height of the graph image in pixels.
   chartborder	The graph border width (in pixels). Set this to 0 if you do not want to use a border on the graph image.

   For example:

   XML

   <charting-wc:downloadChartPNG
                downloadid="cdataonline_png_test"
                stringseparator=";"
                arrayseparator="|"
                messagekey="mapView.download.png"
                imgs="company-logo.png"
                imgcoords="1000;0"
                imgborders="0"
                margin="5"
                texts="#{tableBean.tableDataModel.databaseDisplayName};Generated by SuperWEB2;(c) 2013;"
                textcoords="126;30|126;48|126;68|540;1160"
                textformats="16;Bold;Arial|12;Bold;Arial|12;Bold;Arial|10;Plain;Arial"
                chartimgx="0"
                chartimgy="110"
                chartimgsizex="1280"
                chartimgsizey="1024"
                chartborder="0"/>

4. Save your changes to the file.
5. Restart Tomcat or the SuperWEB2 service.
6. Create a graph and download a PNG image: