Focal Point Banner


As of December 1, 2020, Focal Point is retired and repurposed as a reference repository. We value the wealth of knowledge that's been shared here over the years. You'll continue to have access to this treasure trove of knowledge, for search purposes only.

Join the TIBCO Community
TIBCO Community is a collaborative space for users to share knowledge and support one another in making the best use of TIBCO products and services. There are several TIBCO WebFOCUS resources in the community.

  • From the Home page, select Predict: WebFOCUS to view articles, questions, and trending articles.
  • Select Products from the top navigation bar, scroll, and then select the TIBCO WebFOCUS product page to view product overview, articles, and discussions.
  • Request access to the private WebFOCUS User Group (login required) to network with fellow members.

Former myibi community members should have received an email on 8/3/22 to activate their user accounts to join the community. Check your Spam folder for the email. Please get in touch with us at community@tibco.com for further assistance. Reference the community FAQ to learn more about the community.


Focal Point    Focal Point Forums  Hop To Forum Categories  WebFOCUS/FOCUS Forum on Focal Point     [CLOSED] Storing Custom Created High chart as an image

Read-Only Read-Only Topic
Go
Search
Notify
Tools
[CLOSED] Storing Custom Created High chart as an image
 Login/Join
 
Surenther
Silver Member
posted
Hello,

We are needing to create custom chart which is not available in WebFOCUS. I have used High charts to create that chart.It's working fine in browser. I am also needing to export this chart with other WebFOCUS created tabular report. Highcharts Export functionality just downloading chart into browser. I want to store this chart as an image in WebFOCUS Server So, that i can refer that image while creating PDF report. is there any options available to achieve this? . I tried using EDAPUT but its not seems to be working.

Sample code 

 -HTMLFORM BEGIN
<HTML>
<HEAD>
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/heatmap.js"></script>
<script src="http://code.highcharts.com/highcharts-more.js"></script>
-*<script src="https://code.highcharts.com/modules/exporting.js"></script>
<BODY>
<div id="container" style="height: 300px; min-width: 200px; max-width: 400px; margin: 0 auto"></div>

<SCRIPT>
Highcharts.chart('container', {

chart: {
        type: 'heatmap',
        marginTop: 40,
        marginBottom: 80,
        plotBorderWidth: 1
    },

credits: {
        enabled: false
},

title: {
        text: 'Asset Allocation'
 },

xAxis: [{ categories: ['Value', 'Blend', 'Growth'],title : {text:'Valuation'},lineWidth: 0,tickWidth: 0,},
		{visiblility:false,labels:{enabled:false},title : {text:null},lineWidth: 0,tickWidth: 0,}
],

yAxis: [{ categories: ['Small', 'Medium', 'Large'],title : {text:'Market Cap'}},
		{visiblility:false,labels:{enabled:false},title : {text:null}}
],

-* plotOptions: {  bubble:{maxSize:'30%'} },

colorAxis: {
        min: 0,
        minColor: '#FFFFFF',
        maxColor: Highcharts.getOptions().colors[0]
},

    legend: {
        align: 'right',
        layout: 'horizontal',
        margin: 0,
        verticalAlign: 'bottom',
        y: 500,
        symbolHeight: 280
    },

tooltip: {
        	formatter: function () {
						if(this.series.name == 'heat') {
            							return '[b]' + this.series.yAxis.categories[this.point.y] + ''+
                 						this.series.xAxis.categories[this.point.x] +  this.point.value + '%'+'[/b]';
					} else {
										return false;
					}
        }
  },


series: [
		{   type: 'heatmap',
        	borderWidth: 1,
			yAxis: 0,
			xAxis:0,
			name:'heat',
        	data: [[0,0,25],[0,1,58],[0,2,12],[1,0,19],[1,1,95],[1,2,23],[2,0,8],[2,1,62],[2,2,64]],
        	dataLabels: {
            			enabled: true,
            			color: '#000000',
						formatter: function() {
       								return this.point.value+"%";
   					        }
       	              }
    	},
{
        type: 'bubble',
		yAxis: 1,
		xAxis:1,
		color:'#7BAFD4',
		name:'bubble',
       	data: [[.2, 0, 25]],
		dataLabels: {enabled: false},
		showInLegend: false,
}
		]

});
</SCRIPT>

</BODY>

</HTML>

-HTMLFORM END

This message has been edited. Last edited by: FP Mod Chuck,


----------------------------------
Prod Version:WebFocus 8.1.05,OS:Unix ,Output:ALL
 
Posts: 29 | Location: North Carolina | Registered: August 26, 2008Report This Post
FP Mod Chuck
Virtuoso
posted Hide Post
Surenther

I attempted to run your example and all I got was a blank page. If this is still a question for you I suggest you open a case with techsupport and get their advice on how to maybe achieve what you want.


Thank you for using Focal Point!

Chuck Wolff - Focal Point Moderator
WebFOCUS 7x and 8x, Windows, Linux All output Formats
 
Posts: 2127 | Location: Customer Support | Registered: April 12, 2005Report This Post
Francis Mariani
Expert
posted Hide Post
I have no trouble running your code - I see the Highcharts chart.



I added
<script src="https://code.highcharts.com/modules/exporting.js"></script>
which provides the hamburger menu to download a version of the chart in image or PDF format.

I am not up-to-date on built-in WebFOCUS functionality to include an image version of a Highcharts chart.

Highcharts does offer offline exporting via
<script src="http://code.highcharts.com/modules/offline-exporting.js"></script>
though I don't know how easy this is to incorporate into a WebFOCUS program. Documentation: Client side export.

Have you tried the GUI tools to do this with a normal Highcharts chart that is available in WebFOCUS?

I am willing to be paid to look into this Smiler

This message has been edited. Last edited by: Francis Mariani,


Francis


Give me code, or give me retirement. In FOCUS since 1991

Production: WF 7.7.05M, Dev Studio, BID, MRE, WebSphere, DB2 / Test: WF 8.1.05M, App Studio, BI Portal, Report Caster, jQuery, HighCharts, Apache Tomcat, MS SQL Server
 
Posts: 10577 | Location: Toronto, Ontario, Canada | Registered: April 27, 2005Report This Post
Surenther
Silver Member
posted Hide Post
quote:
Originally posted by Francis Mariani:
I have no trouble running your code - I see the Highcharts chart.



I added
<script src="https://code.highcharts.com/modules/exporting.js"></script>
which provides the hamburger menu to download a version of the chart in image or PDF format.

I am not up-to-date on built-in WebFOCUS functionality to include an image version of a Highcharts chart.

Highcharts does offer offline exporting via
<script src="http://code.highcharts.com/modules/offline-exporting.js"></script>
though I don't know how easy this is to incorporate into a WebFOCUS program. Documentation: Client side export.

Have you tried the GUI tools to do this with a normal Highcharts chart that is available in WebFOCUS?

I am willing to be paid to look into this Smiler


Thanks a for the info. Yes, i have already looked into offline exporting but as you mentioned i didn't able to find solution to integrate with WebFOCUS. I have also looked into WebFOCUS GUI not able to create exact chart like this.


----------------------------------
Prod Version:WebFocus 8.1.05,OS:Unix ,Output:ALL
 
Posts: 29 | Location: North Carolina | Registered: August 26, 2008Report This Post
Surenther
Silver Member
posted Hide Post
quote:
Originally posted by FP Mod Chuck:
Surenther

I attempted to run your example and all I got was a blank page. If this is still a question for you I suggest you open a case with techsupport and get their advice on how to maybe achieve what you want.


Hi, I have already opened a case. It's closed mentioning it will be new feature request.


----------------------------------
Prod Version:WebFocus 8.1.05,OS:Unix ,Output:ALL
 
Posts: 29 | Location: North Carolina | Registered: August 26, 2008Report This Post
  Powered by Social Strata  

Read-Only Read-Only Topic

Focal Point    Focal Point Forums  Hop To Forum Categories  WebFOCUS/FOCUS Forum on Focal Point     [CLOSED] Storing Custom Created High chart as an image

Copyright © 1996-2020 Information Builders