{"id":4741,"date":"2008-11-14T11:00:00","date_gmt":"2008-11-14T11:00:00","guid":{"rendered":"http:\/\/blog2.fusioncharts.com\/?p=44"},"modified":"2026-01-20T14:40:57","modified_gmt":"2026-01-20T09:10:57","slug":"fusioncharts-dom-a-new-way-to-include-fusioncharts-in-your-html","status":"publish","type":"post","link":"https:\/\/www.fusioncharts.com\/blog\/fusioncharts-dom-a-new-way-to-include-fusioncharts-in-your-html\/","title":{"rendered":"FusionCharts DOM: A New Way to Include FusionCharts in HTML 2026"},"content":{"rendered":"Till now, to include a chart\/map created by FusionCharts in your HTML page, you had three options:\r\n<ol>\r\n\t<li>Directly use the OBJECT\/EMBED tag to include the SWF file in your HTML content and then use Flashvars to provide the XML data string or URL.<!--more--> <a title=\"Including FusionCharts in your web page using OBJECT\/EMBED tag\" href=\"https:\/\/www.fusioncharts.com\/developers\/documentation\/Contents\/FirstChart.html\" target=\"_blank\" rel=\"noopener noreferrer\">Example here.<\/a> While this method offers the advantage of just having to use HTML code, the code gets confusing at times and in Microsoft Internet Explorer, you would need to click the chart object to activate it, before you could interact with it.<\/li>\r\n\t<li>Or, use the FusionCharts JavaScript class (<span style=\"font-family: Courier\">FusionCharts.js<\/span>) that we provide as part of download. <a title=\"Embedding FusionCharts in web page using FusionCharts JavaScript class\" href=\"https:\/\/www.fusioncharts.com\/developers\/documentation\/Contents\/JSEmbed.html\" target=\"_blank\" rel=\"noopener noreferrer\">Example here.<\/a> This class provides a better way to include of FusionCharts in your web page, overcame the Internet Explorer &#8220;Click to activate&#8221; issue, handled a lot of cross-browser issues and also provided additional API to interact with the charts. This has been the recommended method of embedding FusionCharts. The downside of this method was that developers needed to have naive knowledge of JavaScript syntax to use it, though we have provided a lot of examples that can just be replicated.<\/li>\r\n\t<li>Use the language specific API that we&#8217;ve provided for ASP, PHP, ASP.NET, ColdFusion, JSP, Ruby On Rails etc. in the download pack itself. This API allows you to write the code in your programming language to embed the chart. Behind the scenes, the API generates HTML or JavaScript code as explained above in points 1 &amp; 2.<\/li>\r\n<\/ol>\r\nIn an effort to make this entire process even better and easier, we released <a title=\"FusionCharts DOM - A quick and easy way to include FusionCharts in your HTML code\" href=\"https:\/\/docs.fusioncharts.com\/free\/Contents\/FCDomGettingStarted.html\" target=\"_blank\" rel=\"noopener noreferrer\">FusionCharts DOM<\/a> a few days ago.\r\n\r\n<!--more-->\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\/fusioncharts-dom-a-new-way-to-include-fusioncharts-in-your-html\/#What_is_FusionCharts_DOM\" title=\"What is FusionCharts DOM?\">What is FusionCharts DOM?<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/www.fusioncharts.com\/blog\/fusioncharts-dom-a-new-way-to-include-fusioncharts-in-your-html\/#How_to_use_it\" title=\"How to use it?\">How to use it?<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/www.fusioncharts.com\/blog\/fusioncharts-dom-a-new-way-to-include-fusioncharts-in-your-html\/#In-lining_your_XML_data_in_the_HTML_code\" title=\"In-lining your XML data in the HTML code\">In-lining your XML data in the HTML code<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/www.fusioncharts.com\/blog\/fusioncharts-dom-a-new-way-to-include-fusioncharts-in-your-html\/#Added_Advantage_Specifying_common_settings_for_all_charts_in_page\" title=\"Added Advantage: Specifying common settings for all charts in page\">Added Advantage: Specifying common settings for all charts in page<\/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\/fusioncharts-dom-a-new-way-to-include-fusioncharts-in-your-html\/#Support_for_FusionCharts_events\" title=\"Support for FusionCharts events\">Support for FusionCharts events<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/www.fusioncharts.com\/blog\/fusioncharts-dom-a-new-way-to-include-fusioncharts-in-your-html\/#Related_links\" title=\"Related links\">Related links<\/a><\/li><\/ul><\/nav><\/div>\n<h2><span class=\"ez-toc-section\" id=\"What_is_FusionCharts_DOM\"><\/span>What is FusionCharts DOM?<span class=\"ez-toc-section-end\"><\/span><\/h2>\r\nEssentially, FusionCharts DOM is a JavaScript file (<span style=\"font-family: Courier\">FusionChartsDOM.js<\/span>) that you need to include in your HTML page, along with the standard FusionCharts JavaScript class (<span style=\"font-family: Courier\">FusionCharts.js<\/span>). You can download both the files here.\r\n<h3><span class=\"ez-toc-section\" id=\"How_to_use_it\"><\/span>How to use it?<span class=\"ez-toc-section-end\"><\/span><\/h3>\r\nOnce you&#8217;ve downloaded and included the 2 JavaScript files in your page, to create a chart, all you need to do is use the<span style=\"font-family: Courier\"> &lt;fusioncharts&gt;&lt;\/fusioncharts&gt; <span style=\"font-family: Trebuchet MS\">tag in your HTML code. Consider the code below:<\/span><\/span>\r\n\r\n\r\n<pre class=\"lang:markup\">&lt;html&gt;\r\n ... Your HTML Code here ....\r\n  &lt;p&gt;\r\n &lt;fusioncharts chartType=\"MSCombi2D\" dataUrl=\"profit_revenue.xml\" width=\"100%\"&gt;\r\n &lt;\/fusioncharts&gt;\r\n &lt;\/p&gt;\r\n ... Your HTML Code here ....\r\n &lt;\/html&gt;<\/pre>\r\n\r\n\r\nThis code creates a Multi-series combination 2D chart with its data source specified as <span style=\"font-family: Courier\">Profit_revenue.xml<\/span>. See it live here.\r\n\r\nThere are a lot of attributes which you can specify for <span style=\"font-family: Courier\">&lt;fusioncharts&gt;<\/span> element. The entire list can be found here .\r\n<h3><span class=\"ez-toc-section\" id=\"In-lining_your_XML_data_in_the_HTML_code\"><\/span>In-lining your XML data in the HTML code<span class=\"ez-toc-section-end\"><\/span><\/h3>\r\nIf you do not wish to have an external XML file and have the XML data in-lined in the HTML code itself, the following code could be used:\r\n\r\n\r\n<pre class=\"lang:javascript\">&lt;fusioncharts chartType=\"Doughnut2D\" width=\"100%\"&gt;\r\n  &lt;data&gt;&lt;!--[CDATA[\r\n    &lt;chart caption=\"Usage share of Web Browsers\"\r\n      subcaption=\"Third quarter of 2008\" numberSuffix=\"%\"\r\n      palette='3' pieRadius='90' &gt;\r\n      &lt;set name=\"IE6\" tooltext=\"Internet Explorer 6\" value=\"33.13\"&gt;&lt;\/set&gt;\r\n      &lt;set name=\"IE7\" tooltext=\"Internet Explorer 7\" value=\"39.09\"&gt;&lt;\/set&gt;\r\n      &lt;set name=\"Chrome\" tooltext=\"Chrome\" value=\"0.26\"&gt;&lt;\/set&gt;\r\n      &lt;set name=\"FF\" tooltext=\"Mozilla Firefox\" value=\"19.48\"&gt;&lt;\/set&gt;\r\n      &lt;set name=\"N\" tooltext=\"Netscape\" value=\"0.68\"&gt;&lt;\/set&gt;\r\n      &lt;set name=\"Opera\" tooltext=\"Opera\" value=\".71\"&gt;&lt;\/set&gt;\r\n      &lt;set name=\"Safari\" tooltext=\"Safari\" value=\"6.39\"&gt;&lt;\/set&gt;\r\n      &lt;set name=\"Others\" tooltext=\"Others\" value=\"0.26\"&gt;&lt;\/set&gt;\r\n    \r\n  ]]--&gt;&lt;\/data&gt;\r\n&lt;\/fusioncharts&gt;<\/pre>\r\n\r\nHere, the entire XML data has been inlined under <span style=\"font-family: Courier\">&lt;data&gt;<\/span> tag. See this live in action.\r\n<h3><span class=\"ez-toc-section\" id=\"Added_Advantage_Specifying_common_settings_for_all_charts_in_page\"><\/span>Added Advantage: Specifying common settings for all charts in page<span class=\"ez-toc-section-end\"><\/span><\/h3>\r\nIf you&#8217;ve multiple charts in a page and wish to specify common settings for all of them,\r\nlike width\/height, debugMode etc., FusionCharts DOM allows you to specify the same\r\nwithin the <span style=\"font-family: Courier\">&lt;script&gt;<\/span> tag as under:\r\n\r\n\r\n<pre class=\"lang:javascript\">!-- script in &lt;head&gt; --&gt;\r\n&lt;script type=\"text\/javascript\" src=\"..\/docs\/JavaScripts\/FusionChartsDOM.js\"\r\n        parameters=\"chartType: 'Line', width: '200', height: '200'\"&gt;&lt;\/script&gt;\r\n...\r\n&lt;!-- fusioncharts HTML tags in &lt;body&gt; --&gt;\r\n&lt;fusioncharts dataUrl=\"data\/CISCO.xml\"&gt;&lt;\/fusioncharts&gt;\r\n&lt;fusioncharts dataUrl=\"data\/IBM.xml\"&gt;&lt;\/fusioncharts&gt;\r\n&lt;fusioncharts dataUrl=\"data\/JAVA.xml\"&gt;&lt;\/fusioncharts&gt;\r\n&lt;fusioncharts dataUrl=\"data\/INTL.xml\"&gt;&lt;\/fusioncharts&gt;\r\n<\/pre>\r\nIn the above code, the four charts are generated as line chart with a width and height of 200 pixels. See it live here.\r\n<h3><span class=\"ez-toc-section\" id=\"Support_for_FusionCharts_events\"><\/span>Support for FusionCharts events<span class=\"ez-toc-section-end\"><\/span><\/h3>\r\nFusionCharts DOM supports all the other events and parameters that are supported by FusionCharts. If you&#8217;ve already integrated FusionCharts in your applications and wish to switch to DOM, the transition is seamless and does not break your existing JavaScript too.\r\n\r\nYou can just replace the existing chart inclusion code with the new DOM style code.\r\n<h2><span class=\"ez-toc-section\" id=\"Related_links\"><\/span>Related links<span class=\"ez-toc-section-end\"><\/span><\/h2>\r\nFusionCharts DOM may be downloaded here . Or, you may read the online documentation here.","protected":false},"excerpt":{"rendered":"<p>Till now, to include a chart\/map created by FusionCharts in your HTML page, you had three options: Directly use the OBJECT\/EMBED tag to include the SWF file in your HTML content and then use Flashvars to provide the XML data string or URL.<\/p>\n","protected":false},"author":7,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[16],"tags":[119,185,195,211],"coauthors":[692],"class_list":["post-4741","post","type-post","status-publish","format-standard","hentry","category-news-announcements","tag-dom","tag-html","tag-integration","tag-javascript"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v24.1 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>FusionCharts DOM: A New Way to Include FusionCharts in HTML 2026<\/title>\n<meta name=\"description\" content=\"Legacy Flash or modern JS? Learn how to include FusionCharts in your 2026 HTML pages using the most efficient methods. Modernize your web presence today.\" \/>\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\/fusioncharts-dom-a-new-way-to-include-fusioncharts-in-your-html\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"FusionCharts DOM: A New Way to Include FusionCharts in HTML 2026\" \/>\n<meta property=\"og:description\" content=\"Legacy Flash or modern JS? Learn how to include FusionCharts in your 2026 HTML pages using the most efficient methods. Modernize your web presence today.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.fusioncharts.com\/blog\/fusioncharts-dom-a-new-way-to-include-fusioncharts-in-your-html\/\" \/>\n<meta property=\"og:site_name\" content=\"FusionBrew - The FusionCharts Blog\" \/>\n<meta property=\"article:published_time\" content=\"2008-11-14T11:00:00+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2026-01-20T09:10:57+00:00\" \/>\n<meta name=\"author\" content=\"sanket\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"sanket\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"4 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\/fusioncharts-dom-a-new-way-to-include-fusioncharts-in-your-html\/#article\",\n\t            \"isPartOf\": {\n\t                \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/fusioncharts-dom-a-new-way-to-include-fusioncharts-in-your-html\/\"\n\t            },\n\t            \"author\": {\n\t                \"name\": \"sanket\",\n\t                \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/#\/schema\/person\/c14c6d9f5b307450557d808a21d1dfdd\"\n\t            },\n\t            \"headline\": \"FusionCharts DOM: A New Way to Include FusionCharts in HTML 2026\",\n\t            \"datePublished\": \"2008-11-14T11:00:00+00:00\",\n\t            \"dateModified\": \"2026-01-20T09:10:57+00:00\",\n\t            \"mainEntityOfPage\": {\n\t                \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/fusioncharts-dom-a-new-way-to-include-fusioncharts-in-your-html\/\"\n\t            },\n\t            \"wordCount\": 597,\n\t            \"commentCount\": 5,\n\t            \"publisher\": {\n\t                \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/#organization\"\n\t            },\n\t            \"keywords\": [\n\t                \"dom\",\n\t                \"html\",\n\t                \"integration\",\n\t                \"javascript\"\n\t            ],\n\t            \"articleSection\": [\n\t                \"News &amp; Announcements\"\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\/fusioncharts-dom-a-new-way-to-include-fusioncharts-in-your-html\/#respond\"\n\t                    ]\n\t                }\n\t            ]\n\t        },\n\t        {\n\t            \"@type\": \"WebPage\",\n\t            \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/fusioncharts-dom-a-new-way-to-include-fusioncharts-in-your-html\/\",\n\t            \"url\": \"https:\/\/www.fusioncharts.com\/blog\/fusioncharts-dom-a-new-way-to-include-fusioncharts-in-your-html\/\",\n\t            \"name\": \"FusionCharts DOM: A New Way to Include FusionCharts in HTML 2026\",\n\t            \"isPartOf\": {\n\t                \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/#website\"\n\t            },\n\t            \"datePublished\": \"2008-11-14T11:00:00+00:00\",\n\t            \"dateModified\": \"2026-01-20T09:10:57+00:00\",\n\t            \"description\": \"Legacy Flash or modern JS? Learn how to include FusionCharts in your 2026 HTML pages using the most efficient methods. Modernize your web presence today.\",\n\t            \"breadcrumb\": {\n\t                \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/fusioncharts-dom-a-new-way-to-include-fusioncharts-in-your-html\/#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\/fusioncharts-dom-a-new-way-to-include-fusioncharts-in-your-html\/\"\n\t                    ]\n\t                }\n\t            ]\n\t        },\n\t        {\n\t            \"@type\": \"BreadcrumbList\",\n\t            \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/fusioncharts-dom-a-new-way-to-include-fusioncharts-in-your-html\/#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\": \"FusionCharts DOM: A New Way to Include FusionCharts in HTML 2026\"\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\/c14c6d9f5b307450557d808a21d1dfdd\",\n\t            \"name\": \"sanket\",\n\t            \"image\": {\n\t                \"@type\": \"ImageObject\",\n\t                \"inLanguage\": \"en-US\",\n\t                \"@id\": \"https:\/\/www.fusioncharts.com\/blog\/#\/schema\/person\/image\/aa9bf7337aa7dc31f02bbeafe3643705\",\n\t                \"url\": \"\/blog\/wp-content\/wphb-cache\/gravatar\/96f\/96f01842825610174488ebab79a44037x96.jpg\",\n\t                \"contentUrl\": \"\/blog\/wp-content\/wphb-cache\/gravatar\/96f\/96f01842825610174488ebab79a44037x96.jpg\",\n\t                \"caption\": \"sanket\"\n\t            },\n\t            \"url\": \"https:\/\/www.fusioncharts.com\/blog\/author\/sanket\/\"\n\t        }\n\t    ]\n\t}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"FusionCharts DOM: A New Way to Include FusionCharts in HTML 2026","description":"Legacy Flash or modern JS? Learn how to include FusionCharts in your 2026 HTML pages using the most efficient methods. Modernize your web presence today.","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\/fusioncharts-dom-a-new-way-to-include-fusioncharts-in-your-html\/","og_locale":"en_US","og_type":"article","og_title":"FusionCharts DOM: A New Way to Include FusionCharts in HTML 2026","og_description":"Legacy Flash or modern JS? Learn how to include FusionCharts in your 2026 HTML pages using the most efficient methods. Modernize your web presence today.","og_url":"https:\/\/www.fusioncharts.com\/blog\/fusioncharts-dom-a-new-way-to-include-fusioncharts-in-your-html\/","og_site_name":"FusionBrew - The FusionCharts Blog","article_published_time":"2008-11-14T11:00:00+00:00","article_modified_time":"2026-01-20T09:10:57+00:00","author":"sanket","twitter_card":"summary_large_image","twitter_misc":{"Written by":"sanket","Est. reading time":"4 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.fusioncharts.com\/blog\/fusioncharts-dom-a-new-way-to-include-fusioncharts-in-your-html\/#article","isPartOf":{"@id":"https:\/\/www.fusioncharts.com\/blog\/fusioncharts-dom-a-new-way-to-include-fusioncharts-in-your-html\/"},"author":{"name":"sanket","@id":"https:\/\/www.fusioncharts.com\/blog\/#\/schema\/person\/c14c6d9f5b307450557d808a21d1dfdd"},"headline":"FusionCharts DOM: A New Way to Include FusionCharts in HTML 2026","datePublished":"2008-11-14T11:00:00+00:00","dateModified":"2026-01-20T09:10:57+00:00","mainEntityOfPage":{"@id":"https:\/\/www.fusioncharts.com\/blog\/fusioncharts-dom-a-new-way-to-include-fusioncharts-in-your-html\/"},"wordCount":597,"commentCount":5,"publisher":{"@id":"https:\/\/www.fusioncharts.com\/blog\/#organization"},"keywords":["dom","html","integration","javascript"],"articleSection":["News &amp; Announcements"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.fusioncharts.com\/blog\/fusioncharts-dom-a-new-way-to-include-fusioncharts-in-your-html\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.fusioncharts.com\/blog\/fusioncharts-dom-a-new-way-to-include-fusioncharts-in-your-html\/","url":"https:\/\/www.fusioncharts.com\/blog\/fusioncharts-dom-a-new-way-to-include-fusioncharts-in-your-html\/","name":"FusionCharts DOM: A New Way to Include FusionCharts in HTML 2026","isPartOf":{"@id":"https:\/\/www.fusioncharts.com\/blog\/#website"},"datePublished":"2008-11-14T11:00:00+00:00","dateModified":"2026-01-20T09:10:57+00:00","description":"Legacy Flash or modern JS? Learn how to include FusionCharts in your 2026 HTML pages using the most efficient methods. Modernize your web presence today.","breadcrumb":{"@id":"https:\/\/www.fusioncharts.com\/blog\/fusioncharts-dom-a-new-way-to-include-fusioncharts-in-your-html\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.fusioncharts.com\/blog\/fusioncharts-dom-a-new-way-to-include-fusioncharts-in-your-html\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.fusioncharts.com\/blog\/fusioncharts-dom-a-new-way-to-include-fusioncharts-in-your-html\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.fusioncharts.com\/blog\/"},{"@type":"ListItem","position":2,"name":"FusionCharts DOM: A New Way to Include FusionCharts in HTML 2026"}]},{"@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\/c14c6d9f5b307450557d808a21d1dfdd","name":"sanket","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.fusioncharts.com\/blog\/#\/schema\/person\/image\/aa9bf7337aa7dc31f02bbeafe3643705","url":"\/blog\/wp-content\/wphb-cache\/gravatar\/96f\/96f01842825610174488ebab79a44037x96.jpg","contentUrl":"\/blog\/wp-content\/wphb-cache\/gravatar\/96f\/96f01842825610174488ebab79a44037x96.jpg","caption":"sanket"},"url":"https:\/\/www.fusioncharts.com\/blog\/author\/sanket\/"}]}},"_links":{"self":[{"href":"https:\/\/www.fusioncharts.com\/blog\/wp-json\/wp\/v2\/posts\/4741","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\/7"}],"replies":[{"embeddable":true,"href":"https:\/\/www.fusioncharts.com\/blog\/wp-json\/wp\/v2\/comments?post=4741"}],"version-history":[{"count":0,"href":"https:\/\/www.fusioncharts.com\/blog\/wp-json\/wp\/v2\/posts\/4741\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.fusioncharts.com\/blog\/wp-json\/wp\/v2\/media?parent=4741"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.fusioncharts.com\/blog\/wp-json\/wp\/v2\/categories?post=4741"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.fusioncharts.com\/blog\/wp-json\/wp\/v2\/tags?post=4741"},{"taxonomy":"author","embeddable":true,"href":"https:\/\/www.fusioncharts.com\/blog\/wp-json\/wp\/v2\/coauthors?post=4741"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}