{"id":15968,"date":"2017-04-21T15:21:08","date_gmt":"2017-04-21T09:51:08","guid":{"rendered":"http:\/\/www.fusioncharts.com\/blog\/?p=15968"},"modified":"2026-01-20T14:41:37","modified_gmt":"2026-01-20T09:11:37","slug":"render-charts-using-fusioncharts-and-javafx","status":"publish","type":"post","link":"https:\/\/www.fusioncharts.com\/blog\/render-charts-using-fusioncharts-and-javafx\/","title":{"rendered":"Render Charts Using FusionCharts and JavaFX: Tutorial"},"content":{"rendered":"<strong>JavaFX<\/strong> is a software platform used to create and deliver desktop applications. With large set of built-in GUI components like text fields, webviews, buttons, tables and many more, it is very easy to create a desktop application using JavaFX. As this platform has support for almost all the operating systems (Microsoft Windows,Linux, macOS) it can run across a wide variety of devices.\r\n \r\nThis tutorial will guide you on how you can render charts using FusionCharts and JavaFX. Let\u2019s get started with the requirements and the steps mentioned below.\r\n\r\n<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_71 counter-hierarchy ez-toc-counter ez-toc-grey ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\"><p class=\"ez-toc-title\" style=\"cursor:inherit\">Table of Contents<\/p>\n<\/div><nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/www.fusioncharts.com\/blog\/render-charts-using-fusioncharts-and-javafx\/#Prerequisites\" title=\"Prerequisites\">Prerequisites<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/www.fusioncharts.com\/blog\/render-charts-using-fusioncharts-and-javafx\/#System_Requirements\" title=\"System Requirements\">System Requirements<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/www.fusioncharts.com\/blog\/render-charts-using-fusioncharts-and-javafx\/#Creating_Chart_Object\" title=\"Creating Chart Object\">Creating Chart Object<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/www.fusioncharts.com\/blog\/render-charts-using-fusioncharts-and-javafx\/#Step_1\" title=\"Step 1:\">Step 1:<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/www.fusioncharts.com\/blog\/render-charts-using-fusioncharts-and-javafx\/#Step_2\" title=\"Step 2:\">Step 2:<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/www.fusioncharts.com\/blog\/render-charts-using-fusioncharts-and-javafx\/#Step_3\" title=\"Step 3:\">Step 3:<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/www.fusioncharts.com\/blog\/render-charts-using-fusioncharts-and-javafx\/#Rendering_the_Chart\" title=\"Rendering the Chart\">Rendering the Chart<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-8\" href=\"https:\/\/www.fusioncharts.com\/blog\/render-charts-using-fusioncharts-and-javafx\/#Rendering_Chart_using_an_External_File\" title=\"Rendering Chart using an External File\">Rendering Chart using an External File<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-9\" href=\"https:\/\/www.fusioncharts.com\/blog\/render-charts-using-fusioncharts-and-javafx\/#Rendering_chart_from_a_Static_String\" title=\"Rendering chart from a Static String\">Rendering chart from a Static String<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-10\" href=\"https:\/\/www.fusioncharts.com\/blog\/render-charts-using-fusioncharts-and-javafx\/#Was_There_a_Problem_Rendering_the_Charts\" title=\"Was There a Problem Rendering the Charts?\">Was There a Problem Rendering the Charts?<\/a><\/li><\/ul><\/nav><\/div>\n<h2><span class=\"ez-toc-section\" id=\"Prerequisites\"><\/span>Prerequisites<span class=\"ez-toc-section-end\"><\/span><\/h2>\r\n\r\nBefore we start with the requirements and steps to implement charts using FusionCharts and JavaFX, let&#8217;s first discuss about the essentials of user capabilities to implement it.\r\n\r\n<ul>\r\n\t<li>Must be familiar with the basic concepts of Java.<\/li>\r\n\t<li>Must have a basic idea of how to create JavaFX application.<\/li>\r\n\t<li>Must know the basics of HTML.<\/li>\r\n<\/ul>\r\n\r\n<h2><span class=\"ez-toc-section\" id=\"System_Requirements\"><\/span>System Requirements<span class=\"ez-toc-section-end\"><\/span><\/h2>\r\n\r\n<ul>\r\n\t<li>FusionCharts Suite XT [<a href=\"https:\/\/www.fusioncharts.com\/download\/\" target=\"_blank\" rel=\"noopener noreferrer\">Download Link<\/a>]<\/li>\r\n\t<li>FusionCharts JSP Wrapper [<a href=\"https:\/\/www.fusioncharts.com\/dev\/getting-started\/java\/your-first-chart-using-java\" target=\"_blank\" rel=\"noopener noreferrer\">Download Link<\/a>]<\/li>\r\n<\/ul>\r\n\r\n<h2><span class=\"ez-toc-section\" id=\"Creating_Chart_Object\"><\/span>Creating Chart Object<span class=\"ez-toc-section-end\"><\/span><\/h2>\r\n\r\nTo create a chart object, firstly, create a <a href=\"https:\/\/docs.oracle.com\/javase\/8\/javase-clienttechnologies.htm\" target=\"_blank\" rel=\"noopener noreferrer\">JavaFX<\/a> application.\r\nOnce the application has been created, create a Java class which will contain buttons and a webview. Use an event handler on the button, to show the chart as an output in the webview.\r\n\r\nFollowing are the step by step code snippets of <strong>.java<\/strong> code to create a chart object:\r\n\r\n<h3><span class=\"ez-toc-section\" id=\"Step_1\"><\/span>Step 1:<span class=\"ez-toc-section-end\"><\/span><\/h3>\r\n\r\nFirst, import all the packages required to create the application.\r\n\r\n<pre class=\"lang:java\">\r\nimport java.io.File;\r\nimport java.net.MalformedURLException;\r\nimport java.net.URL;\r\nimport java.util.logging.Level;\r\nimport java.util.logging.Logger;\r\nimport javafx.application.Application;\r\nimport javafx.scene.control.Button;\r\nimport javafx.event.EventHandler;\r\nimport javafx.event.ActionEvent;\r\nimport javafx.scene.web.WebEngine;\r\nimport javafx.scene.layout.VBox;\r\nimport javafx.scene.Scene;\r\nimport javafx.scene.web.WebView;\r\nimport javafx.stage.Stage;\r\n<\/pre>\r\n\r\n<h3><span class=\"ez-toc-section\" id=\"Step_2\"><\/span>Step 2:<span class=\"ez-toc-section-end\"><\/span><\/h3>\r\n\r\nCreate a button object, which on click will fire an event. The event will fetch the path of the external location of the file which in return will render the chart. Once done the chart will be displayed in the <strong>webview<\/strong>.\r\n\r\n<pre class=\"lang:java\">\r\npublic class Fusioncharts_javafx extends Application {\r\n\r\n    @Override\r\n    public void start(Stage stage) throws Exception {\r\n            WebView myWebView = new WebView();\r\n            final WebEngine engine = myWebView.getEngine();\r\n\r\n\r\n\r\n            Button btn1 = new Button(&#x22;Render Chart from file&#x22;);\r\n            btn1.setOnAction(new EventHandler &#x3C; ActionEvent &#x3E; () {\r\n\r\n                @Override\r\n                public void handle(ActionEvent event) {\r\n\r\n                    File currDir = new File(&#x22;.&#x22;);\r\n                    String path = currDir.getAbsolutePath();\r\n                    path = path.substring(0, path.length() - 1);\r\n                    path = path.replaceAll(&#x22;\\\\\\\\&#x22;, &#x22;\/&#x22;);\r\n                    \/\/ System.out.println(path);\r\n\r\n\r\n                    File file = new File(path + &#x22;\/src\/fusioncharts_javafx\/index.html&#x22;);\r\n                    URL url;\r\n                    try {\r\n                        url = file.toURI().toURL();\r\n                        engine.load(url.toString());\r\n                    } catch (MalformedURLException ex) {\r\n                        Logger.getLogger(Fusioncharts_javafx.class.getName()).log(Level.SEVERE, null, ex);\r\n                    }\r\n\r\n                    \/\/ file:\/C:\/test\/a.html\r\n\r\n                }\r\n            });\r\n<\/pre>\r\n\r\n<ul>\r\n<li>Include FusionCharts library files which are required to render the chart.<\/li>\r\n<li>To render the chart in the webview run the HTML file. <\/li>\r\n<li>Create a button object, which on click will run the HTML file.<\/li>\r\n<\/ul>\r\nFollowing is the code of the chart to be rendered using the HTML file:\r\n\r\n<pre class=\"lang:markup\">\r\n&#x3C;html&#x3E;\r\n\r\n&#x3C;head&#x3E;\r\n    &#x3C;title&#x3E;My first chart using FusionCharts Suite XT&#x3C;\/title&#x3E;\r\n    &#x3C;script type=&#x22;text\/javascript&#x22; src=&#x22;fusioncharts.js&#x22;&#x3E;&#x3C;\/script&#x3E;\r\n    &#x3C;script type=&#x22;text\/javascript&#x22; src=&#x22;fusioncharts.charts.js&#x22;&#x3E;&#x3C;\/script&#x3E;\r\n    &#x3C;script type=&#x22;text\/javascript&#x22;&#x3E;\r\n        FusionCharts.ready(function() {\r\n            var revenueChart = new FusionCharts({\r\n                type: &#x27;column2d&#x27;,\r\n                renderAt: &#x27;chartContainer&#x27;,\r\n                width: &#x27;550&#x27;,\r\n                height: &#x27;350&#x27;,\r\n                dataFormat: &#x27;json&#x27;,\r\n                dataSource: {\r\n                    &#x22;chart&#x22;: {\r\n                        &#x22;caption&#x22;: &#x22;Monthly revenue for last year&#x22;,\r\n                        &#x22;subCaption&#x22;: &#x22;Harry&#x27;s SuperMart&#x22;,\r\n                        &#x22;xAxisName&#x22;: &#x22;Month&#x22;,\r\n                        &#x22;yAxisName&#x22;: &#x22;Revenues (In USD)&#x22;,\r\n                        &#x22;numberPrefix&#x22;: &#x22;$&#x22;,\r\n                        &#x22;paletteColors&#x22;: &#x22;#0075c2&#x22;,\r\n                        &#x22;bgColor&#x22;: &#x22;#ffffff&#x22;,\r\n                        &#x22;borderAlpha&#x22;: &#x22;20&#x22;,\r\n                        &#x22;canvasBorderAlpha&#x22;: &#x22;0&#x22;,\r\n                        &#x22;usePlotGradientColor&#x22;: &#x22;0&#x22;,\r\n                        &#x22;plotBorderAlpha&#x22;: &#x22;10&#x22;,\r\n                        &#x22;placevaluesInside&#x22;: &#x22;1&#x22;,\r\n                        &#x22;rotatevalues&#x22;: &#x22;1&#x22;,\r\n                        &#x22;valueFontColor&#x22;: &#x22;#ffffff&#x22;,\r\n                        &#x22;showXAxisLine&#x22;: &#x22;1&#x22;,\r\n                        &#x22;xAxisLineColor&#x22;: &#x22;#999999&#x22;,\r\n                        &#x22;divlineColor&#x22;: &#x22;#999999&#x22;,\r\n                        &#x22;divLineIsDashed&#x22;: &#x22;1&#x22;,\r\n                        &#x22;showAlternateHGridColor&#x22;: &#x22;0&#x22;,\r\n                        &#x22;subcaptionFontBold&#x22;: &#x22;0&#x22;,\r\n                        &#x22;subcaptionFontSize&#x22;: &#x22;14&#x22;\r\n                    },\r\n                    &#x22;data&#x22;: [{\r\n                            &#x22;label&#x22;: &#x22;Jan&#x22;,\r\n                            &#x22;value&#x22;: &#x22;420000&#x22;\r\n                        },\r\n                        {\r\n                            &#x22;label&#x22;: &#x22;Feb&#x22;,\r\n                            &#x22;value&#x22;: &#x22;810000&#x22;\r\n                        },\r\n                        {\r\n                            &#x22;label&#x22;: &#x22;Mar&#x22;,\r\n                            &#x22;value&#x22;: &#x22;720000&#x22;\r\n                        },\r\n                        {\r\n                            &#x22;label&#x22;: &#x22;Apr&#x22;,\r\n                            &#x22;value&#x22;: &#x22;550000&#x22;\r\n                        },\r\n                        {\r\n                            &#x22;label&#x22;: &#x22;May&#x22;,\r\n                            &#x22;value&#x22;: &#x22;910000&#x22;\r\n                        },\r\n                        {\r\n                            &#x22;label&#x22;: &#x22;Jun&#x22;,\r\n                            &#x22;value&#x22;: &#x22;510000&#x22;\r\n                        },\r\n                        {\r\n                            &#x22;label&#x22;: &#x22;Jul&#x22;,\r\n                            &#x22;value&#x22;: &#x22;680000&#x22;\r\n                        },\r\n                        {\r\n                            &#x22;label&#x22;: &#x22;Aug&#x22;,\r\n                            &#x22;value&#x22;: &#x22;620000&#x22;\r\n                        },\r\n                        {\r\n                            &#x22;label&#x22;: &#x22;Sep&#x22;,\r\n                            &#x22;value&#x22;: &#x22;610000&#x22;\r\n                        },\r\n                        {\r\n                            &#x22;label&#x22;: &#x22;Oct&#x22;,\r\n                            &#x22;value&#x22;: &#x22;490000&#x22;\r\n                        },\r\n                        {\r\n                            &#x22;label&#x22;: &#x22;Nov&#x22;,\r\n                            &#x22;value&#x22;: &#x22;900000&#x22;\r\n                        },\r\n                        {\r\n                            &#x22;label&#x22;: &#x22;Dec&#x22;,\r\n                            &#x22;value&#x22;: &#x22;730000&#x22;\r\n                        }\r\n                    ],\r\n                    &#x22;trendlines&#x22;: [{\r\n                        &#x22;line&#x22;: [{\r\n                            &#x22;startvalue&#x22;: &#x22;700000&#x22;,\r\n                            &#x22;color&#x22;: &#x22;#1aaf5d&#x22;,\r\n                            &#x22;valueOnRight&#x22;: &#x22;1&#x22;,\r\n                            &#x22;displayvalue&#x22;: &#x22;Monthly Target&#x22;\r\n                        }]\r\n                    }]\r\n                }\r\n            }).render();\r\n        });\r\n    &#x3C;\/script&#x3E;\r\n&#x3C;\/head&#x3E;\r\n\r\n&#x3C;body&#x3E;\r\n    &#x3C;div id=&#x22;chartContainer&#x22;&#x3E;FusionCharts XT will load here! &#x3C;\/div&#x3E;\r\n    &#x3C;div&#x3E;Loaded from a file&#x3C;\/div&#x3E;\r\n&#x3C;\/body&#x3E;\r\n\r\n&#x3C;\/html&#x3E;\r\n<\/pre>\r\n\r\n<h3><span class=\"ez-toc-section\" id=\"Step_3\"><\/span>Step 3:<span class=\"ez-toc-section-end\"><\/span><\/h3>\r\n\r\nTo render the chart using the static string, pass the entire code as string to the <strong>engine.loadContent<\/strong> method. Refer to the following code for <strong>engine.loadContent<\/strong> method:\r\n\r\n<pre class=\"lang:java\">\r\n Button btn2 = new Button(\"Render Chart from static string\");\r\n btn2.setOnAction(new EventHandler  () {\r\n\r\n     @Override\r\n     public void handle(ActionEvent event) {\r\n         engine.loadContent(\"\\n\" +\r\n             \"\\n\" +            \r\n             \"\\n\" +\r\n             \"\\n\" +\r\n             \"\\n\" +\r\n             \"FusionCharts.ready(function () {\\n\" +\r\n             \"    var revenueChart = new FusionCharts({\\n\" +\r\n             \"        type: 'doughnut2d',\\n\" +\r\n             \"        renderAt: 'chart-container',\\n\" +\r\n             \"        width: '450',\\n\" +\r\n             \"        height: '450',\\n\" +\r\n             \"        dataFormat: 'json',\\n\" +\r\n             \"        dataSource: {\\n\" +\r\n             \"            \\\"chart\\\": {\\n\" +\r\n             \"                \\\"caption\\\": \\\"Split of Revenue by Product Categories\\\",\\n\" +\r\n             \"                \\\"subCaption\\\": \\\"Last year\\\",\\n\" +\r\n             \"                \\\"numberPrefix\\\": \\\"$\\\",\\n\" +\r\n             \"                \\\"paletteColors\\\": \\\"#0075c2,#1aaf5d,#f2c500,#f45b00,#8e0000\\\",\\n\" +\r\n             \"                \\\"bgColor\\\": \\\"#ffffff\\\",\\n\" +\r\n             \"                \\\"showBorder\\\": \\\"0\\\",\\n\" +\r\n             \"                \\\"use3DLighting\\\": \\\"0\\\",\\n\" +\r\n             \"                \\\"showShadow\\\": \\\"0\\\",\\n\" +\r\n             \"                \\\"enableSmartLabels\\\": \\\"0\\\",\\n\" +\r\n             \"                \\\"startingAngle\\\": \\\"310\\\",\\n\" +\r\n             \"                \\\"showLabels\\\": \\\"0\\\",\\n\" +\r\n             \"                \\\"showPercentValues\\\": \\\"1\\\",\\n\" +\r\n             \"                \\\"showLegend\\\": \\\"1\\\",\\n\" +\r\n             \"                \\\"legendShadow\\\": \\\"0\\\",\\n\" +\r\n             \"                \\\"legendBorderAlpha\\\": \\\"0\\\",\\n\" +\r\n             \"                \\\"defaultCenterLabel\\\": \\\"Total revenue: $64.08K\\\",\\n\" +\r\n             \"                \\\"centerLabel\\\": \\\"Revenue from $label: $value\\\",\\n\" +\r\n             \"                \\\"centerLabelBold\\\": \\\"1\\\",\\n\" +\r\n             \"                \\\"showTooltip\\\": \\\"0\\\",\\n\" +\r\n             \"                \\\"decimals\\\": \\\"0\\\",\\n\" +\r\n             \"                \\\"captionFontSize\\\": \\\"14\\\",\\n\" +\r\n             \"                \\\"subcaptionFontSize\\\": \\\"14\\\",\\n\" +\r\n             \"                \\\"subcaptionFontBold\\\": \\\"0\\\"\\n\" +\r\n             \"            },\\n\" +\r\n             \"            \\\"data\\\": [\\n\" +\r\n             \"                {\\n\" +\r\n             \"                    \\\"label\\\": \\\"Food\\\",\\n\" +\r\n             \"                    \\\"value\\\": \\\"28504\\\"\\n\" +\r\n             \"                }, \\n\" +\r\n             \"                {\\n\" +\r\n             \"                    \\\"label\\\": \\\"Apparels\\\",\\n\" +\r\n             \"                    \\\"value\\\": \\\"14633\\\"\\n\" +\r\n             \"                }, \\n\" +\r\n             \"                {\\n\" +\r\n             \"                    \\\"label\\\": \\\"Electronics\\\",\\n\" +\r\n             \"                    \\\"value\\\": \\\"10507\\\"\\n\" +\r\n             \"                }, \\n\" +\r\n             \"                {\\n\" +\r\n             \"                    \\\"label\\\": \\\"Household\\\",\\n\" +\r\n             \"                    \\\"value\\\": \\\"4910\\\"\\n\" +\r\n             \"                }\\n\" +\r\n             \"            ]\\n\" +\r\n             \"        }\\n\" +\r\n             \"    }).render();\\n\" +\r\n             \"});\\n\" +\r\n             \"\\n\" +\r\n             \"\\n\" +\r\n             \"\\n\" +\r\n             \"  <div id=\"chart-container\">FusionCharts XT will load here!<\/div>\\n\" +\r\n             \"<div> Loaded from a string <\/div>\\n\" +\r\n             \"\\n\" +\r\n             \"\");\r\n     }\r\n });\r\n\r\n VBox root = new VBox();\r\n root.getChildren().addAll(myWebView, btn1, btn2);\r\n\r\n Scene scene = new Scene(root, 700, 510);\r\n stage.setScene(scene);\r\n stage.show();\r\n }\r\n\r\n \/**\r\n  * @param args the command line arguments\r\n  *\/\r\n public static void main(String[] args) {\r\n     launch(args);\r\n }\r\n\r\n }\r\n<\/pre>\r\n\r\nThe full java code for the sample looks as under:\r\n\r\n<pre class=\"lang:java\">\r\nimport java.io.File;\r\nimport java.net.MalformedURLException;\r\nimport java.net.URL;\r\nimport java.util.logging.Level;\r\nimport java.util.logging.Logger;\r\nimport javafx.application.Application;\r\nimport javafx.scene.control.Button;\r\nimport javafx.event.EventHandler;\r\nimport javafx.event.ActionEvent;\r\nimport javafx.scene.web.WebEngine;\r\nimport javafx.scene.layout.VBox;\r\nimport javafx.scene.Scene;\r\nimport javafx.scene.web.WebView;\r\nimport javafx.stage.Stage;\r\npublic class Fusioncharts_javafx extends Application {\r\n\r\n    @Override\r\n    public void start(Stage stage) throws Exception {\r\n        WebView myWebView = new WebView();\r\n        final WebEngine engine = myWebView.getEngine();\r\n\r\n\r\n\r\n        Button btn1 = new Button(\"Render Chart from file\");\r\n        btn1.setOnAction(new EventHandler  () {\r\n\r\n            @Override\r\n            public void handle(ActionEvent event) {\r\n\r\n                File currDir = new File(\".\");\r\n                String path = currDir.getAbsolutePath();\r\n                path = path.substring(0, path.length() - 1);\r\n                path = path.replaceAll(\"\\\\\\\\\", \"\/\");\r\n                \/\/ System.out.println(path);\r\n\r\n\r\n                File file = new File(path + \"\/src\/fusioncharts_javafx\/index.html\");\r\n                URL url;\r\n                try {\r\n                    url = file.toURI().toURL();\r\n                    engine.load(url.toString());\r\n                } catch (MalformedURLException ex) {\r\n                    Logger.getLogger(Fusioncharts_javafx.class.getName()).log(Level.SEVERE, null, ex);\r\n                }\r\n\r\n                \/\/ file:\/C:\/test\/a.html\r\n\r\n            }\r\n        });\r\n\r\n        Button btn2 = new Button(\"Render Chart from static string\");\r\n        btn2.setOnAction(new EventHandler  () {\r\n\r\n            @Override\r\n            public void handle(ActionEvent event) {\r\n                engine.loadContent(\"\\n\" +\r\n                    \"\\n\" +                   \r\n                    \"\\n\" +\r\n                    \"\\n\" +\r\n                    \"\\n\" +\r\n                    \"FusionCharts.ready(function () {\\n\" +\r\n                    \"    var revenueChart = new FusionCharts({\\n\" +\r\n                    \"        type: 'doughnut2d',\\n\" +\r\n                    \"        renderAt: 'chart-container',\\n\" +\r\n                    \"        width: '450',\\n\" +\r\n                    \"        height: '450',\\n\" +\r\n                    \"        dataFormat: 'json',\\n\" +\r\n                    \"        dataSource: {\\n\" +\r\n                    \"            \\\"chart\\\": {\\n\" +\r\n                    \"                \\\"caption\\\": \\\"Split of Revenue by Product Categories\\\",\\n\" +\r\n                    \"                \\\"subCaption\\\": \\\"Last year\\\",\\n\" +\r\n                    \"                \\\"numberPrefix\\\": \\\"$\\\",\\n\" +\r\n                    \"                \\\"paletteColors\\\": \\\"#0075c2,#1aaf5d,#f2c500,#f45b00,#8e0000\\\",\\n\" +\r\n                    \"                \\\"bgColor\\\": \\\"#ffffff\\\",\\n\" +\r\n                    \"                \\\"showBorder\\\": \\\"0\\\",\\n\" +\r\n                    \"                \\\"use3DLighting\\\": \\\"0\\\",\\n\" +\r\n                    \"                \\\"showShadow\\\": \\\"0\\\",\\n\" +\r\n                    \"                \\\"enableSmartLabels\\\": \\\"0\\\",\\n\" +\r\n                    \"                \\\"startingAngle\\\": \\\"310\\\",\\n\" +\r\n                    \"                \\\"showLabels\\\": \\\"0\\\",\\n\" +\r\n                    \"                \\\"showPercentValues\\\": \\\"1\\\",\\n\" +\r\n                    \"                \\\"showLegend\\\": \\\"1\\\",\\n\" +\r\n                    \"                \\\"legendShadow\\\": \\\"0\\\",\\n\" +\r\n                    \"                \\\"legendBorderAlpha\\\": \\\"0\\\",\\n\" +\r\n                    \"                \\\"defaultCenterLabel\\\": \\\"Total revenue: $64.08K\\\",\\n\" +\r\n                    \"                \\\"centerLabel\\\": \\\"Revenue from $label: $value\\\",\\n\" +\r\n                    \"                \\\"centerLabelBold\\\": \\\"1\\\",\\n\" +\r\n                    \"                \\\"showTooltip\\\": \\\"0\\\",\\n\" +\r\n                    \"                \\\"decimals\\\": \\\"0\\\",\\n\" +\r\n                    \"                \\\"captionFontSize\\\": \\\"14\\\",\\n\" +\r\n                    \"                \\\"subcaptionFontSize\\\": \\\"14\\\",\\n\" +\r\n                    \"                \\\"subcaptionFontBold\\\": \\\"0\\\"\\n\" +\r\n                    \"            },\\n\" +\r\n                    \"            \\\"data\\\": [\\n\" +\r\n                    \"                {\\n\" +\r\n                    \"                    \\\"label\\\": \\\"Food\\\",\\n\" +\r\n                    \"                    \\\"value\\\": \\\"28504\\\"\\n\" +\r\n                    \"                }, \\n\" +\r\n                    \"                {\\n\" +\r\n                    \"                    \\\"label\\\": \\\"Apparels\\\",\\n\" +\r\n                    \"                    \\\"value\\\": \\\"14633\\\"\\n\" +\r\n                    \"                }, \\n\" +\r\n                    \"                {\\n\" +\r\n                    \"                    \\\"label\\\": \\\"Electronics\\\",\\n\" +\r\n                    \"                    \\\"value\\\": \\\"10507\\\"\\n\" +\r\n                    \"                }, \\n\" +\r\n                    \"                {\\n\" +\r\n                    \"                    \\\"label\\\": \\\"Household\\\",\\n\" +\r\n                    \"                    \\\"value\\\": \\\"4910\\\"\\n\" +\r\n                    \"                }\\n\" +\r\n                    \"            ]\\n\" +\r\n                    \"        }\\n\" +\r\n                    \"    }).render();\\n\" +\r\n                    \"});\\n\" +\r\n                    \"\\n\" +\r\n                    \"\\n\" +\r\n                    \"\\n\" +\r\n                    \"  <div id=\"chart-container\">FusionCharts XT will load here!<\/div>\\n\" +\r\n                    \"<div> Loaded from a string <\/div>\\n\" +\r\n                    \"\\n\" +\r\n                    \"\");\r\n            }\r\n        });\r\n\r\n        VBox root = new VBox();\r\n        root.getChildren().addAll(myWebView, btn1, btn2);\r\n\r\n        Scene scene = new Scene(root, 700, 510);\r\n        stage.setScene(scene);\r\n        stage.show();\r\n    }\r\n\r\n    \/**\r\n     * @param args the command line arguments\r\n     *\/\r\n    public static void main(String[] args) {\r\n        launch(args);\r\n    }\r\n\r\n}\r\n<\/pre>\r\n\r\n<h2><span class=\"ez-toc-section\" id=\"Rendering_the_Chart\"><\/span>Rendering the Chart<span class=\"ez-toc-section-end\"><\/span><\/h2>\r\n\r\nNow, the .java file is all set to run in your application. Any of the two buttons can be selected to render your chart using following two ways:\r\n\r\n<ul>\r\n\t<li>Using an External File<\/li>\r\n\t<li>Using a Static String<\/li>\r\n<\/ul>\r\n\r\nFor both the methods, there are 2 separate buttons by which the chart can be rendered. Following is the output for the same:\r\n\r\n<h3><span class=\"ez-toc-section\" id=\"Rendering_Chart_using_an_External_File\"><\/span>Rendering Chart using an External File<span class=\"ez-toc-section-end\"><\/span><\/h3>\r\n\r\n<img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/04\/chart-using-external-file.png\" alt=\"\" width=\"722\" height=\"548\" class=\"alignnone size-full wp-image-15976\" srcset=\"\/blog\/wp-content\/uploads\/2017\/04\/chart-using-external-file.png 722w, \/blog\/wp-content\/uploads\/2017\/04\/chart-using-external-file-150x114.png 150w\" sizes=\"auto, (max-width: 722px) 100vw, 722px\" \/>\r\n\r\n<h3><span class=\"ez-toc-section\" id=\"Rendering_chart_from_a_Static_String\"><\/span>Rendering chart from a Static String<span class=\"ez-toc-section-end\"><\/span><\/h3>\r\n\r\n<img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/04\/chart-using-static-string.png\" alt=\"\" width=\"718\" height=\"552\" class=\"alignnone size-full wp-image-15977\" srcset=\"\/blog\/wp-content\/uploads\/2017\/04\/chart-using-static-string.png 718w, \/blog\/wp-content\/uploads\/2017\/04\/chart-using-static-string-150x115.png 150w\" sizes=\"auto, (max-width: 718px) 100vw, 718px\" \/>\r\n\r\nIf you find any difficulty rendering the chart or with the configuration files, you can download this demo project from <a href=\"https:\/\/www.dropbox.com\/s\/zrixoktut0b9lze\/Fusioncharts_javafx.zip?dl=0\" target=\"_blank\" rel=\"noopener noreferrer\">here<\/a> and import it on your system.\r\n\r\n<h2><span class=\"ez-toc-section\" id=\"Was_There_a_Problem_Rendering_the_Charts\"><\/span> Was There a Problem Rendering the Charts? <span class=\"ez-toc-section-end\"><\/span><\/h2>\r\n\r\nIn case something went wrong and you are unable to see the chart, check for the following:\r\n<ul>\r\n<li> The chart ID should be unique for all charts rendered on the same page. Otherwise, it will result in a JavaScript error. <\/li>\r\n<li> If the chart does not show up at all, check if the <strong>fusioncharts.js<\/strong> and FusionCharts wrapper <strong>FusionCharts.java<\/strong> was loaded. Also, check if the path to the <strong>fusioncharts.js<\/strong> and the <strong>FusionCharts.java<\/strong> files is correct, and whether the files exist in that location. <\/li><\/ul>\r\n\r\n\r\n\r\n","protected":false},"excerpt":{"rendered":"<p>JavaFX is a software platform used to create and deliver desktop applications. With large set of built-in GUI components like text fields, webviews, buttons, tables and many more, it is very easy to create a desktop application using JavaFX. As this platform has support for almost all the operating systems (Microsoft Windows,Linux, macOS) it can [&hellip;]<\/p>\n","protected":false},"author":33,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[18],"tags":[152,666,664,663,665],"coauthors":[648,647],"class_list":["post-15968","post","type-post","status-publish","format-standard","hentry","category-tutorials","tag-fusioncharts","tag-java","tag-javafx","tag-render-charts-using-fusioncharts-and-javafx","tag-software-platform"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v24.1 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Render Charts Using FusionCharts and JavaFX: Tutorial<\/title>\n<meta name=\"description\" content=\"Build professional desktop applications with JavaFX and FusionCharts. Our 2026 guide shows you how to integrate interactive charts into your GUI components.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.fusioncharts.com\/blog\/render-charts-using-fusioncharts-and-javafx\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Render Charts Using FusionCharts and JavaFX: Tutorial\" \/>\n<meta property=\"og:description\" content=\"Build professional desktop applications with JavaFX and FusionCharts. Our 2026 guide shows you how to integrate interactive charts into your GUI components.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.fusioncharts.com\/blog\/render-charts-using-fusioncharts-and-javafx\/\" \/>\n<meta property=\"og:site_name\" content=\"FusionBrew - The FusionCharts Blog\" \/>\n<meta property=\"article:published_time\" content=\"2017-04-21T09:51:08+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2026-01-20T09:11:37+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/2017\/04\/chart-using-external-file.png\" \/>\n\t<meta property=\"og:image:width\" content=\"722\" \/>\n\t<meta property=\"og:image:height\" content=\"548\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Ayan Bhadury, Dishank Tiwari\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Ayan Bhadury, Dishank Tiwari\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"9 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\n\t    \"@context\": \"https:\/\/schema.org\",\n\t    \"@graph\": [\n\t        {\n\t            \"@type\": \"Article\",\n\t            \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/render-charts-using-fusioncharts-and-javafx\/#article\",\n\t            \"isPartOf\": {\n\t                \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/render-charts-using-fusioncharts-and-javafx\/\"\n\t            },\n\t            \"author\": {\n\t                \"name\": \"Ayan Bhadury\",\n\t                \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/#\/schema\/person\/24e8946ae2b802e172aa5964689ca243\"\n\t            },\n\t            \"headline\": \"Render Charts Using FusionCharts and JavaFX: Tutorial\",\n\t            \"datePublished\": \"2017-04-21T09:51:08+00:00\",\n\t            \"dateModified\": \"2026-01-20T09:11:37+00:00\",\n\t            \"mainEntityOfPage\": {\n\t                \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/render-charts-using-fusioncharts-and-javafx\/\"\n\t            },\n\t            \"wordCount\": 558,\n\t            \"commentCount\": 0,\n\t            \"publisher\": {\n\t                \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/#organization\"\n\t            },\n\t            \"image\": {\n\t                \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/render-charts-using-fusioncharts-and-javafx\/#primaryimage\"\n\t            },\n\t            \"thumbnailUrl\": \"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/04\/chart-using-external-file.png\",\n\t            \"keywords\": [\n\t                \"FusionCharts\",\n\t                \"java\",\n\t                \"JavaFX\",\n\t                \"Render Charts using FusionCharts and JavaFX\",\n\t                \"software platform\"\n\t            ],\n\t            \"articleSection\": [\n\t                \"Tutorials\"\n\t            ],\n\t            \"inLanguage\": \"en-US\",\n\t            \"potentialAction\": [\n\t                {\n\t                    \"@type\": \"CommentAction\",\n\t                    \"name\": \"Comment\",\n\t                    \"target\": [\n\t                        \"https:\/\/www.fusioncharts.com\/blog\/render-charts-using-fusioncharts-and-javafx\/#respond\"\n\t                    ]\n\t                }\n\t            ]\n\t        },\n\t        {\n\t            \"@type\": \"WebPage\",\n\t            \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/render-charts-using-fusioncharts-and-javafx\/\",\n\t            \"url\": \"https:\/\/www.fusioncharts.com\/blog\/render-charts-using-fusioncharts-and-javafx\/\",\n\t            \"name\": \"Render Charts Using FusionCharts and JavaFX: Tutorial\",\n\t            \"isPartOf\": {\n\t                \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/#website\"\n\t            },\n\t            \"primaryImageOfPage\": {\n\t                \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/render-charts-using-fusioncharts-and-javafx\/#primaryimage\"\n\t            },\n\t            \"image\": {\n\t                \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/render-charts-using-fusioncharts-and-javafx\/#primaryimage\"\n\t            },\n\t            \"thumbnailUrl\": \"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/04\/chart-using-external-file.png\",\n\t            \"datePublished\": \"2017-04-21T09:51:08+00:00\",\n\t            \"dateModified\": \"2026-01-20T09:11:37+00:00\",\n\t            \"description\": \"Build professional desktop applications with JavaFX and FusionCharts. Our 2026 guide shows you how to integrate interactive charts into your GUI components.\",\n\t            \"breadcrumb\": {\n\t                \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/render-charts-using-fusioncharts-and-javafx\/#breadcrumb\"\n\t            },\n\t            \"inLanguage\": \"en-US\",\n\t            \"potentialAction\": [\n\t                {\n\t                    \"@type\": \"ReadAction\",\n\t                    \"target\": [\n\t                        \"https:\/\/www.fusioncharts.com\/blog\/render-charts-using-fusioncharts-and-javafx\/\"\n\t                    ]\n\t                }\n\t            ]\n\t        },\n\t        {\n\t            \"@type\": \"ImageObject\",\n\t            \"inLanguage\": \"en-US\",\n\t            \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/render-charts-using-fusioncharts-and-javafx\/#primaryimage\",\n\t            \"url\": \"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/04\/chart-using-external-file.png\",\n\t            \"contentUrl\": \"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/04\/chart-using-external-file.png\"\n\t        },\n\t        {\n\t            \"@type\": \"BreadcrumbList\",\n\t            \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/render-charts-using-fusioncharts-and-javafx\/#breadcrumb\",\n\t            \"itemListElement\": [\n\t                {\n\t                    \"@type\": \"ListItem\",\n\t                    \"position\": 1,\n\t                    \"name\": \"Home\",\n\t                    \"item\": \"https:\/\/www.fusioncharts.com\/blog\/\"\n\t                },\n\t                {\n\t                    \"@type\": \"ListItem\",\n\t                    \"position\": 2,\n\t                    \"name\": \"Render Charts Using FusionCharts and JavaFX: Tutorial\"\n\t                }\n\t            ]\n\t        },\n\t        {\n\t            \"@type\": \"WebSite\",\n\t            \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/#website\",\n\t            \"url\": \"https:\/\/www.fusioncharts.com\/blog\/\",\n\t            \"name\": \"FusionBrew - The FusionCharts Blog\",\n\t            \"description\": \"Get tips and tricks on how to build effective Data Visualisation using FusionCharts\",\n\t            \"publisher\": {\n\t                \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/#organization\"\n\t            },\n\t            \"potentialAction\": [\n\t                {\n\t                    \"@type\": \"SearchAction\",\n\t                    \"target\": {\n\t                        \"@type\": \"EntryPoint\",\n\t                        \"urlTemplate\": \"https:\/\/www.fusioncharts.com\/blog\/?s={search_term_string}\"\n\t                    },\n\t                    \"query-input\": {\n\t                        \"@type\": \"PropertyValueSpecification\",\n\t                        \"valueRequired\": true,\n\t                        \"valueName\": \"search_term_string\"\n\t                    }\n\t                }\n\t            ],\n\t            \"inLanguage\": \"en-US\"\n\t        },\n\t        {\n\t            \"@type\": \"Organization\",\n\t            \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/#organization\",\n\t            \"name\": \"FusionCharts\",\n\t            \"url\": \"https:\/\/www.fusioncharts.com\/blog\/\",\n\t            \"logo\": {\n\t                \"@type\": \"ImageObject\",\n\t                \"inLanguage\": \"en-US\",\n\t                \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/#\/schema\/logo\/image\/\",\n\t                \"url\": \"\/blog\/wp-content\/uploads\/2020\/03\/idera-fc-logo.svg\",\n\t                \"contentUrl\": \"\/blog\/wp-content\/uploads\/2020\/03\/idera-fc-logo.svg\",\n\t                \"width\": 1,\n\t                \"height\": 1,\n\t                \"caption\": \"FusionCharts\"\n\t            },\n\t            \"image\": {\n\t                \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/#\/schema\/logo\/image\/\"\n\t            }\n\t        },\n\t        {\n\t            \"@type\": \"Person\",\n\t            \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/#\/schema\/person\/24e8946ae2b802e172aa5964689ca243\",\n\t            \"name\": \"Ayan Bhadury\",\n\t            \"image\": {\n\t                \"@type\": \"ImageObject\",\n\t                \"inLanguage\": \"en-US\",\n\t                \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/#\/schema\/person\/image\/e8b4bd366bf824e42027140489ad1ba6\",\n\t                \"url\": \"\/blog\/wp-content\/wphb-cache\/gravatar\/017\/017a9628c57694af5b4b3dcf5924840ex96.jpg\",\n\t                \"contentUrl\": \"\/blog\/wp-content\/wphb-cache\/gravatar\/017\/017a9628c57694af5b4b3dcf5924840ex96.jpg\",\n\t                \"caption\": \"Ayan Bhadury\"\n\t            },\n\t            \"url\": \"https:\/\/www.fusioncharts.com\/blog\/author\/ayan-bhadury\/\"\n\t        }\n\t    ]\n\t}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Render Charts Using FusionCharts and JavaFX: Tutorial","description":"Build professional desktop applications with JavaFX and FusionCharts. Our 2026 guide shows you how to integrate interactive charts into your GUI components.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.fusioncharts.com\/blog\/render-charts-using-fusioncharts-and-javafx\/","og_locale":"en_US","og_type":"article","og_title":"Render Charts Using FusionCharts and JavaFX: Tutorial","og_description":"Build professional desktop applications with JavaFX and FusionCharts. Our 2026 guide shows you how to integrate interactive charts into your GUI components.","og_url":"https:\/\/www.fusioncharts.com\/blog\/render-charts-using-fusioncharts-and-javafx\/","og_site_name":"FusionBrew - The FusionCharts Blog","article_published_time":"2017-04-21T09:51:08+00:00","article_modified_time":"2026-01-20T09:11:37+00:00","og_image":[{"width":722,"height":548,"url":"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/2017\/04\/chart-using-external-file.png","type":"image\/png"}],"author":"Ayan Bhadury, Dishank Tiwari","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Ayan Bhadury, Dishank Tiwari","Est. reading time":"9 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.fusioncharts.com\/blog\/render-charts-using-fusioncharts-and-javafx\/#article","isPartOf":{"@id":"https:\/\/www.fusioncharts.com\/blog\/render-charts-using-fusioncharts-and-javafx\/"},"author":{"name":"Ayan Bhadury","@id":"https:\/\/www.fusioncharts.com\/blog\/#\/schema\/person\/24e8946ae2b802e172aa5964689ca243"},"headline":"Render Charts Using FusionCharts and JavaFX: Tutorial","datePublished":"2017-04-21T09:51:08+00:00","dateModified":"2026-01-20T09:11:37+00:00","mainEntityOfPage":{"@id":"https:\/\/www.fusioncharts.com\/blog\/render-charts-using-fusioncharts-and-javafx\/"},"wordCount":558,"commentCount":0,"publisher":{"@id":"https:\/\/www.fusioncharts.com\/blog\/#organization"},"image":{"@id":"https:\/\/www.fusioncharts.com\/blog\/render-charts-using-fusioncharts-and-javafx\/#primaryimage"},"thumbnailUrl":"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/04\/chart-using-external-file.png","keywords":["FusionCharts","java","JavaFX","Render Charts using FusionCharts and JavaFX","software platform"],"articleSection":["Tutorials"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.fusioncharts.com\/blog\/render-charts-using-fusioncharts-and-javafx\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.fusioncharts.com\/blog\/render-charts-using-fusioncharts-and-javafx\/","url":"https:\/\/www.fusioncharts.com\/blog\/render-charts-using-fusioncharts-and-javafx\/","name":"Render Charts Using FusionCharts and JavaFX: Tutorial","isPartOf":{"@id":"https:\/\/www.fusioncharts.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.fusioncharts.com\/blog\/render-charts-using-fusioncharts-and-javafx\/#primaryimage"},"image":{"@id":"https:\/\/www.fusioncharts.com\/blog\/render-charts-using-fusioncharts-and-javafx\/#primaryimage"},"thumbnailUrl":"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/04\/chart-using-external-file.png","datePublished":"2017-04-21T09:51:08+00:00","dateModified":"2026-01-20T09:11:37+00:00","description":"Build professional desktop applications with JavaFX and FusionCharts. Our 2026 guide shows you how to integrate interactive charts into your GUI components.","breadcrumb":{"@id":"https:\/\/www.fusioncharts.com\/blog\/render-charts-using-fusioncharts-and-javafx\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.fusioncharts.com\/blog\/render-charts-using-fusioncharts-and-javafx\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.fusioncharts.com\/blog\/render-charts-using-fusioncharts-and-javafx\/#primaryimage","url":"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/04\/chart-using-external-file.png","contentUrl":"https:\/\/www.fusioncharts.com\/blog\/wp-content\/uploads\/gallery\/blog\/2017\/04\/chart-using-external-file.png"},{"@type":"BreadcrumbList","@id":"https:\/\/www.fusioncharts.com\/blog\/render-charts-using-fusioncharts-and-javafx\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.fusioncharts.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Render Charts Using FusionCharts and JavaFX: Tutorial"}]},{"@type":"WebSite","@id":"https:\/\/www.fusioncharts.com\/blog\/#website","url":"https:\/\/www.fusioncharts.com\/blog\/","name":"FusionBrew - The FusionCharts Blog","description":"Get tips and tricks on how to build effective Data Visualisation using FusionCharts","publisher":{"@id":"https:\/\/www.fusioncharts.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.fusioncharts.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.fusioncharts.com\/blog\/#organization","name":"FusionCharts","url":"https:\/\/www.fusioncharts.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.fusioncharts.com\/blog\/#\/schema\/logo\/image\/","url":"\/blog\/wp-content\/uploads\/2020\/03\/idera-fc-logo.svg","contentUrl":"\/blog\/wp-content\/uploads\/2020\/03\/idera-fc-logo.svg","width":1,"height":1,"caption":"FusionCharts"},"image":{"@id":"https:\/\/www.fusioncharts.com\/blog\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":"https:\/\/www.fusioncharts.com\/blog\/#\/schema\/person\/24e8946ae2b802e172aa5964689ca243","name":"Ayan Bhadury","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.fusioncharts.com\/blog\/#\/schema\/person\/image\/e8b4bd366bf824e42027140489ad1ba6","url":"\/blog\/wp-content\/wphb-cache\/gravatar\/017\/017a9628c57694af5b4b3dcf5924840ex96.jpg","contentUrl":"\/blog\/wp-content\/wphb-cache\/gravatar\/017\/017a9628c57694af5b4b3dcf5924840ex96.jpg","caption":"Ayan Bhadury"},"url":"https:\/\/www.fusioncharts.com\/blog\/author\/ayan-bhadury\/"}]}},"_links":{"self":[{"href":"https:\/\/www.fusioncharts.com\/blog\/wp-json\/wp\/v2\/posts\/15968","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.fusioncharts.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.fusioncharts.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.fusioncharts.com\/blog\/wp-json\/wp\/v2\/users\/33"}],"replies":[{"embeddable":true,"href":"https:\/\/www.fusioncharts.com\/blog\/wp-json\/wp\/v2\/comments?post=15968"}],"version-history":[{"count":0,"href":"https:\/\/www.fusioncharts.com\/blog\/wp-json\/wp\/v2\/posts\/15968\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.fusioncharts.com\/blog\/wp-json\/wp\/v2\/media?parent=15968"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.fusioncharts.com\/blog\/wp-json\/wp\/v2\/categories?post=15968"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.fusioncharts.com\/blog\/wp-json\/wp\/v2\/tags?post=15968"},{"taxonomy":"author","embeddable":true,"href":"https:\/\/www.fusioncharts.com\/blog\/wp-json\/wp\/v2\/coauthors?post=15968"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}