<!DOCTYPE html>
<html lang="en-US" prefix="og: http://ogp.me/ns#">
<head>
<meta charset="UTF-8">
<link rel="icon" type="image/x-icon" href="https://www.amcharts.com/favicon.ico"/>
<meta name="viewport" id="viewport" content="width=device-width, initial-scale=1">
<script>
	if ( screen.width >= 768 && screen.width <= 1136 ) {
		var ratio = Math.round( screen.width / 13 ) / 100;
		document.getElementById( "viewport" ).setAttribute( "content", "width=1300, initial-scale=" + ratio );
	}
</script>
<link rel="profile" href="http://gmpg.org/xfn/11">
<link rel="pingback" href="https://www.amcharts.com/xmlrpc.php">
<title>JavaScript Charts &amp; Maps - amCharts</title>
 
<meta name="description" content="JavaScript / HTML5 charts and maps data-viz libraries for web sites and applications. Fast and responsive. WordPress plugin available. Developed since 2006."/>
<meta name="robots" content="noodp"/>
<link rel="canonical" href="https://www.amcharts.com/"/>
<meta property="og:locale" content="en_US"/>
<meta property="og:type" content="website"/>
<meta property="og:title" content="JavaScript Charts &amp; Maps - amCharts"/>
<meta property="og:description" content="JavaScript / HTML5 charts and maps data-viz libraries for web sites and applications. Fast and responsive. WordPress plugin available. Developed since 2006."/>
<meta property="og:url" content="https://www.amcharts.com/"/>
<meta property="og:site_name" content="amCharts"/>
<meta name="twitter:card" content="summary"/>
<meta name="twitter:description" content="JavaScript / HTML5 charts and maps data-viz libraries for web sites and applications. Fast and responsive. WordPress plugin available. Developed since 2006."/>
<meta name="twitter:title" content="JavaScript Charts &amp; Maps - amCharts"/>
<script type='application/ld+json'>{"@context":"http:\/\/schema.org","@type":"WebSite","url":"https:\/\/www.amcharts.com\/","name":"amCharts","potentialAction":{"@type":"SearchAction","target":"https:\/\/www.amcharts.com\/?s={search_term_string}","query-input":"required name=search_term_string"}}</script>
 
<link rel="alternate" type="application/rss+xml" title="amCharts &raquo; Feed" href="https://www.amcharts.com/feed/"/>
<link rel="alternate" type="application/rss+xml" title="amCharts &raquo; Comments Feed" href="https://www.amcharts.com/comments/feed/"/>
<link rel='stylesheet' id='amcharts2-style-css' href='https://www.amcharts.com/wp-content/themes/amcharts2/css/main.css?ver=20160808-01' type='text/css' media='all'/>
<link rel='stylesheet' id='amcharts2-clients-css' href='https://www.amcharts.com/wp-content/themes/amcharts2/css/clients.css?ver=20160808-01' type='text/css' media='all'/>
<script type='text/javascript' src='https://www.amcharts.com/wp-content/themes/amcharts2/js/html5shiv.min.js?ver=20160808-01'></script>
<script type='text/javascript' src='https://www.amcharts.com/wp-content/themes/amcharts2/js/respond.min.js?ver=20160808-01'></script>
<script type='text/javascript' src='https://www.amcharts.com/wp-includes/js/jquery/jquery.js?ver=1.12.4'></script>
<link rel='https://api.w.org/' href='https://www.amcharts.com/wp-json/'/>
<link rel="EditURI" type="application/rsd+xml" title="RSD" href="https://www.amcharts.com/xmlrpc.php?rsd"/>
<link rel="wlwmanifest" type="application/wlwmanifest+xml" href="https://www.amcharts.com/wp-includes/wlwmanifest.xml"/>
<meta name="generator" content="WordPress 4.5.3"/>
<link rel='shortlink' href='https://www.amcharts.com/'/>
<link rel="alternate" type="application/json+oembed" href="https://www.amcharts.com/wp-json/oembed/1.0/embed?url=https%3A%2F%2Fwww.amcharts.com%2F"/>
<link rel="alternate" type="text/xml+oembed" href="https://www.amcharts.com/wp-json/oembed/1.0/embed?url=https%3A%2F%2Fwww.amcharts.com%2F&#038;format=xml"/>
</head>
<body class="home page page-id-7 page-template page-template-page-templates page-template-overview page-template-page-templatesoverview-php">
<div id="page" class="site">
<header id="masthead" class="site-header" role="banner">
<div class="site-branding">
<a href="https://www.amcharts.com/" id="logo" rel="home">amCharts</a>
<a href="https://www.amcharts.com/" id="amcharts" rel="home" class="trans-all">amCharts</a>
</div> 
<a class="menu-toggle" data-controls="site-navigation" aria-controls="primary-menu" aria-expanded="false">Primary Menu</a>
<nav id="site-navigation" class="main-navigation trans-pos-horiz" role="navigation">
<div class="menu-main-menu-container"><ul id="primary-menu" class="menu"><li id="menu-item-25" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children menu-item-25"><a href="https://www.amcharts.com/products/">Products</a>
<ul class="sub-menu">
<li id="menu-item-40" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-40"><a href="https://www.amcharts.com/javascript-charts/"><i class="icon icon-charts"></i>JavaScript <strong>Charts</strong></a></li>
<li id="menu-item-39" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-39"><a href="https://www.amcharts.com/stock-chart/"><i class="icon icon-stock"></i>JavaScript Stock <strong>Chart</strong></a></li>
<li id="menu-item-38" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-38"><a href="https://www.amcharts.com/javascript-maps/"><i class="icon icon-maps"></i>JavaScript <strong>Maps</strong></a></li>
<li id="menu-item-41" class="overall menu-item menu-item-type-post_type menu-item-object-page menu-item-41"><a href="https://www.amcharts.com/products/">Show all products and tools</a></li>
</ul>
</li>
<li id="menu-item-137" class="demo menu-item menu-item-type-demo menu-item-object-cpt_archive menu-item-137"><a href="https://www.amcharts.com/demos/">Demos</a></li>
<li id="menu-item-24" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-24"><a href="https://www.amcharts.com/download/">Download</a></li>
<li id="menu-item-22" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-22"><a href="https://www.amcharts.com/online-store/">Buy</a></li>
<li id="menu-item-27" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-27"><a href="https://www.amcharts.com/support/">Support</a></li>
<li id="menu-item-6949" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-6949"><a href="https://www.amcharts.com/knowledge-base/">Docs</a></li>
<li id="menu-item-26" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-26"><a href="https://www.amcharts.com/resources/">Resources</a></li>
<li id="menu-item-7136" class="social md-only menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children menu-item-7136"><a href="#">Find us on</a>
<ul class="sub-menu">
<li id="menu-item-7137" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-7137"><a href="https://www.facebook.com/amcharts"><i class="icon icon-facebook" title="Facebook"></i></a></li>
<li id="menu-item-7138" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-7138"><a href="https://www.twitter.com/amcharts"><i class="icon icon-twitter" title="Twitter"></i></a></li>
<li id="menu-item-7139" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-7139"><a href="https://plus.google.com/+amcharts/"><i class="icon icon-google" title="Google+"></i></a></li>
<li id="menu-item-7140" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-7140"><a href="https://www.linkedin.com/company/amcharts"><i class="icon icon-linkedin" title="LinkedIn"></i></a></li>
</ul>
</li>
</ul></div> </nav> 
<div class="header-tools">
<form role="search" method="get" class="search-form" action="https://www.amcharts.com/">
<label>
<span class="screen-reader-text">Search for:</span>
<input type="search" class="search-field" placeholder="Search &hellip;" value="" name="s"/>
</label>
<input type="submit" class="search-submit" value="Search"/>
</form> <div class="share-this" role="navigation">
<a class="share-this-toggle trans-all">Click to share this page</a>
<div class="share-this-content">
Share this on <a href="https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fwww.amcharts.com%2F" onclick="javascript:window.open( this.href, '', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=600,width=600');return false;"><i class="icon icon-facebook2 smaller hide-text trans-all">Share this on Facebook</i></a>
<a href="https://twitter.com/intent/tweet?text=JavaScript+Charts+%26amp%3B+Maps+-+amCharts&url=https%3A%2F%2Fwww.amcharts.com%2F&via=amcharts"><i class="icon icon-twitter2 smaller hide-text trans-all">Share this on Twitter</i></a>
<a href="https://plus.google.com/share?url=https%3A%2F%2Fwww.amcharts.com%2F" onclick="javascript:window.open( this.href, '', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=600,width=600');return false;"><i class="icon icon-google2 smaller hide-text trans-all">Share this on Google+</i></a>
<a href="https://www.linkedin.com/shareArticle?mini=true&url=https%3A%2F%2Fwww.amcharts.com%2F&summary=JavaScript+Charts+%26amp%3B+Maps+-+amCharts&source=amcharts" onclick="javascript:window.open( this.href, '', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=600,width=600');return false;"><i class="icon icon-linkedin2 smaller hide-text trans-all">Share this on LinedIn</i></a>
<a href="mailto:?subject=JavaScript+Charts+%26amp%3B+Maps+-+amCharts&body=https%3A%2F%2Fwww.amcharts.com%2F&via=amcharts"><i class="icon icon-mail2 smaller hide-text trans-all">Share this via email</i></a>
</div>
</div> </div>
<a href="https://live.amcharts.com/" id="editor-link">Live Editor</a>
</header> 
<div id="content" class="site-content">
<div id="primary" class="content-area">
<main id="main" class="site-main" role="main">
<article id="post-7" class="post-7 page type-page status-publish hentry">
<header class="entry-header hero">
<div class="content-col">
<h1 class="entry-title">JavaScript Charts &#038; Maps</h1>
<h5 style="text-align: center;">Programming libraries and tools for all your data visualization needs</h5>
<p style="text-align: center;"><a class="button bigger" href="https://www.amcharts.com/demos/"><i class="icon icon-demo smaller"></i>Check demos</a> <a class="button bigger" href="https://www.amcharts.com/download/"><i class="icon icon-download smaller"></i>Free Download</a> <a class="button bigger" href="https://www.amcharts.com/online-store/"><i class="icon icon-buy smaller"></i>Buy a License</a></p>
<p style="text-align: center;">
<div class="demo-block theme-light">
<div id="chartdiv_304"></div>
<style>#chartdiv_304{width:100%;height:300px;}.amcharts-graph-g4{filter:url(#blur);}</style>
</div>
<div class="row margin-top-big">
<div class="col-md-3 col-sm-6"><a href="https://www.amcharts.com/kbase/making-charts-responsive/"><i class="icon responsive" style="background: url(https://www.amcharts.com/wp-content/themes/amcharts2/css/img/icons/responsive.png) no-repeat; background: none, url(https://www.amcharts.com/wp-content/themes/amcharts2/css/img/icons/responsive.svg) no-repeat; background-size: contain;"></i></a></p>
<h3><a href="https://www.amcharts.com/kbase/making-charts-responsive/">100% responsive</a></h3>
<p>The charts automatically adapt to available space by re-arranging, sizing and toggling their elements and controls.</p></div>
<div class="col-md-3 col-sm-6"><a href="https://www.amcharts.com/products/customizing-charts/"><i class="icon customize" style="background: url(https://www.amcharts.com/wp-content/themes/amcharts2/css/img/icons/customize.png) no-repeat; background: none, url(https://www.amcharts.com/wp-content/themes/amcharts2/css/img/icons/customize.svg) no-repeat; background-size: contain;"></i></a></p>
<h3><a href="https://www.amcharts.com/products/customizing-charts/">Extremely Customizable</a></h3>
<p>Colors, styles, layout, animations, functionality, events &#8211; almost every aspect of the libraries can be customized with config or custom code.</p></div>
<div class="col-md-3 col-sm-6"><a href="https://www.amcharts.com/support/about-support/"><i class="icon support" style="background: url(https://www.amcharts.com/wp-content/themes/amcharts2/css/img/icons/support.png) no-repeat; background: none, url(https://www.amcharts.com/wp-content/themes/amcharts2/css/img/icons/support.svg) no-repeat; background-size: contain;"></i></a></p>
<h3><a href="https://www.amcharts.com/support/about-support/">Superior Support</a></h3>
<p>We go out of our way to provide the best support experience to our users. We got your back!</p></div>
<div class="col-md-3 col-sm-6"><a href="https://www.amcharts.com/accessibility/"><i class="icon accessible" style="background: url(https://www.amcharts.com/wp-content/themes/amcharts2/css/img/icons/accessible.png) no-repeat; background: none, url(https://www.amcharts.com/wp-content/themes/amcharts2/css/img/icons/accessible.svg) no-repeat; background-size: contain;"></i></a></p>
<h3><a href="https://www.amcharts.com/accessibility/">Accessible</a></h3>
<p>It&#8217;s not just a promise. We did make our software truly accessible by following Section 508, W3C and community-established techniques.</p></div>
</div>
</div>
</header> 
<div class="extra-content home-product alt-headers padding-top-huge padding-bottom-huge">
<div class="entry-content content-col">
<h4 style="text-align: center;">Our products</h4>
<div class="row margin-top-big">
<div class="col-md-6 slider slider-nav-bottom slider-shadowed rounded" data-slides="1" data-height="370px">
<div class="demo-block theme-light">
<div id="chartdiv_6867"></div>
<style>#chartdiv_6867{height:500px;background:#357cd2;}#chartdiv_6867{height:370px;}</style>
</div>
<div class="demo-block theme-light">
<div id="chartdiv_8258"></div>
<style>#chartdiv_8258{height:500px;}#chartdiv_8258{height:370px;}</style>
</div>
<div class="demo-block theme-light">
<div id="chartdiv_8272"></div>
<style>#chartdiv_8272{height:500px;}#chartdiv_8272{height:370px;}</style>
</div>
</div>
<div class="col-md-6 padding-left-big padding-right-big">
<h2>JavaScript Charts</h2>
<p>Easily add charting capabilities to your websites and applications. Compatible with all modern and most legacy browsers (yes even IE7), JavaScript Charts allows creating flexible Pie, Column, Line, and number of other chart types.</p>
<p>&nbsp;</p>
<p><a class="button lite bigger" href="https://www.amcharts.com/javascript-charts/">More info</a> <a class="button lite bigger" href="https://www.amcharts.com/demos/"><i class="icon icon-demo smaller"></i>Check demos</a></div>
</div>
</div>
</div>
<div class="extra-content home-product alt-headers alt-bg2 padding-top-huge padding-bottom-huge">
<div class="entry-content content-col">
<h4 style="text-align: center;">Our products</h4>
<div class="row margin-top-big">
<div class="col-md-6">
<div class="demo-block shadowed extendable rounded padding theme-dark">
<div id="chartdiv_6869"></div>
<style>#chartdiv_6869{width:100%;height:500px;}#chartdiv_6869 input{padding:3px 7px;margin:0 3px;}#chartdiv_6869{height:500px;}</style>
</div>
</div>
<div class="col-md-6 padding-left-big padding-right-big">
<h2>JavaScript Stock Chart</h2>
<p>Does everything JavaScript Charts V3 does and much more: multiple panels, automatic data point grouping, multiple data set and data comparison. Irreplaceable when creating interactive visualization for financial or just about any other date/time-based data.</p>
<p>&nbsp;</p>
<p><a class="button lite bigger" href="https://www.amcharts.com/stock-chart/">More info</a> <a class="button lite bigger" href="https://www.amcharts.com/demos/#stock-chart"><i class="icon icon-demo smaller"></i>Check demos</a></div>
</div>
</div>
</div>
<div class="extra-content home-product alt-headers full-width">
<div class="entry-content ">
<div class="row content-col pos-static">
<h4 style="text-align: center;">Our products</h4>
</div>
<div class="demo-block demo-background theme-light">
<div id="chartdiv_6847"></div>
<style>#chartdiv_6847{width:100%;height:500px;background:#d5eff7;}#chartdiv_6847{height:700px;}</style>
</div>
<div class="row content-col pos-static">
<div class="col-md-5 padding-left-big padding-right-big padding-bottom-big home-maps-intro">
<h2>JavaScript Maps</h2>
<p>A drop-in solution for all your mapping needs. Create awesome looking maps, routes, drill-downs on world or country level.</p>
<p>&nbsp;</p>
<p><a class="button lite bigger" href="https://www.amcharts.com/javascript-maps/">More info</a> <a class="button lite bigger" href="https://www.amcharts.com/demos/#javascript-maps"><i class="icon icon-demo smaller"></i>Check demos</a></div>
</div>
</div>
</div>
<div class="alt-headers content-col" role="complementary">
<div class="entry-content extra-content center">
<h4 style="text-align: center;">Our clients</h4>
<h5 style="text-align: center;">Trusted and loved by big players and individuals around the world</h5>
<i class="icon bigger" style="background-image: url(https://www.amcharts.com/wp-content/themes/amcharts2/css/img/icons/quote.png); background-image: none, url(https://www.amcharts.com/wp-content/themes/amcharts2/css/img/icons/quote.svg);"></i>
<div class="cross-fader">
<div class="cross-fader-item current" style="display: block;">
<div class="testimonial">
<p class="testimonial-content">Firstly I wanted to thank you for all your hard work on ammaps and amcharts – they’re excellent tools which have really helped me to move away from depending on flash!</p>
<p class="testimonial-author">
<img src="http://www.gravatar.com/avatar/12e6a7bf83f0d968a98b6229bea75c90?d=&s=38" class="gravatar"/>
Scott Fenn </p>
</div>
</div>
<div class="cross-fader-item">
<div class="testimonial">
<p class="testimonial-content">I found amCharts provided the best solution for my online chart needs. There were a number of things they offered that their competition could not provide me.</p>
<p class="testimonial-author">
<img src="http://www.gravatar.com/avatar/2e7cd38d22322592f3db101fb356467b?d=&s=38" class="gravatar"/>
Dimitrios Tsotos </p>
</div>
</div>
<div class="cross-fader-item">
<div class="testimonial">
<p class="testimonial-content">Awesome. Wow, amCharts is making this too easy! I really appreciate your product: it's effective, well documented and the support is top notch.</p>
<p class="testimonial-author">
<img src="http://www.gravatar.com/avatar/9bd7885f4eeae4392479fa990f2630d7?d=&s=38" class="gravatar"/>
Daniel McQuillen </p>
</div>
</div>
<div class="cross-fader-item">
<div class="testimonial">
<p class="testimonial-content">I’ve to say that I both love your charts and awesome support!!! Worked perfectly.</p>
<p class="testimonial-author">
<img src="http://www.gravatar.com/avatar/fa5d33ea730ecaed342e41c668283da3?d=&s=38" class="gravatar"/>
John Leger </p>
</div>
</div>
<div class="cross-fader-item">
<div class="testimonial">
<p class="testimonial-content">This is genius! Now I just want to make charts all day... which is good and bad haha. Take it easy!</p>
<p class="testimonial-author">
<img src="http://www.gravatar.com/avatar/2b9bc6dc03e396747e50a64a2c9a4295?d=&s=38" class="gravatar"/>
Evan Padgett </p>
</div>
</div>
<div class="cross-fader-item">
<div class="testimonial">
<p class="testimonial-content">Finally got world's best company, website, chart</p>
<p class="testimonial-author">
<img src="http://www.gravatar.com/avatar/4805f4a1883c667b67077d6906b0b8c3?d=&s=38" class="gravatar"/>
mv kaushalam </p>
</div>
</div>
<div class="cross-fader-item">
<div class="testimonial">
<p class="testimonial-content">I just wanted to give you guys kudos for having an awesome product. We are using your charts for one of our clients and they love it. They are extremely impressed with our delivery, and I have no doubt that no small part is our use of AmCharts.</p>
<p class="testimonial-author">
<img src="http://www.gravatar.com/avatar/87684a35ee76f5f77258ede6d1b10454?d=&s=38" class="gravatar"/>
Michael Armes </p>
</div>
</div>
<div class="cross-fader-item">
<div class="testimonial">
<p class="testimonial-content">I have to admit that you customer support is the fastest and most efficient I know :) !</p>
<p class="testimonial-author">
<img src="http://www.gravatar.com/avatar/b90c52910e25e27e15ca650d84a120a8?d=&s=38" class="gravatar"/>
Julien Despois </p>
</div>
</div>
<div class="cross-fader-item">
<div class="testimonial">
<p class="testimonial-content">By far, I haven't seen anything as beautiful as your charts. They far exceed anything in the industry.</p>
<p class="testimonial-author">
<img src="http://www.gravatar.com/avatar/3be1c413533f7f6cc7f9fabd33c81be9?d=&s=38" class="gravatar"/>
Amer Gill </p>
</div>
</div>
</div>
</div>
</div>
<div class="clients carousel no-center no-saturate" role="complementary">
<a class="carousel-nav carousel-left trans-all">Scroll left</a>
<a class="carousel-nav carousel-right trans-all">Scroll right</a>
<div class="carousel-wrapper">
<ul class="carousel-items">
<li class="client carousel-item trans-all client-yandex amcharts-tooltip" data-title="Yandex"></li>
<li class="client carousel-item trans-all client-pfizer amcharts-tooltip" data-title="Pfizer"></li>
<li class="client carousel-item trans-all client-att amcharts-tooltip" data-title="at&amp;t"></li>
<li class="client carousel-item trans-all client-cbs amcharts-tooltip" data-title="CBS"></li>
<li class="client carousel-item trans-all client-dow-chemical amcharts-tooltip" data-title="Dow Chemical"></li>
<li class="client carousel-item trans-all client-royal-bank-of-scotland amcharts-tooltip" data-title="Royal Bank of Scotland"></li>
<li class="client carousel-item trans-all client-ing amcharts-tooltip" data-title="ING"></li>
<li class="client carousel-item trans-all client-jpmorgan amcharts-tooltip" data-title="J.P.Morgan"></li>
<li class="client carousel-item trans-all client-credit-suisse amcharts-tooltip" data-title="Credit Suisse"></li>
<li class="client carousel-item trans-all client-sap amcharts-tooltip" data-title="SAP"></li>
<li class="client carousel-item trans-all client-audi amcharts-tooltip" data-title="Audi"></li>
<li class="client carousel-item trans-all client-siemens amcharts-tooltip" data-title="Siemens"></li>
<li class="client carousel-item trans-all client-ebay amcharts-tooltip" data-title="ebay"></li>
<li class="client carousel-item trans-all client-ibm amcharts-tooltip" data-title="IBM"></li>
<li class="client carousel-item trans-all client-bank-of-america amcharts-tooltip" data-title="Bank of America"></li>
<li class="client carousel-item trans-all client-microsoft amcharts-tooltip" data-title="Microsoft"></li>
<li class="client carousel-item trans-all client-amazoncom amcharts-tooltip" data-title="amazon.com"></li>
<li class="client carousel-item trans-all client-ntt-data amcharts-tooltip" data-title="NTT DATA"></li>
<li class="client carousel-item trans-all client-nasa amcharts-tooltip" data-title="NASA"></li>
<li class="client carousel-item trans-all client-morningstar amcharts-tooltip" data-title="MorningStar"></li>
<li class="client carousel-item trans-all client-nomura amcharts-tooltip" data-title="Nomura"></li>
<li class="client carousel-item trans-all client-proctergamble amcharts-tooltip" data-title="Procter&amp;Gamble"></li>
<li class="client carousel-item trans-all client-paypal amcharts-tooltip" data-title="PayPal"></li>
<li class="client carousel-item trans-all client-symantec amcharts-tooltip" data-title="Symantec"></li>
<li class="client carousel-item trans-all client-samsung amcharts-tooltip" data-title="Samsung"></li>
<li class="client carousel-item trans-all client-cisco amcharts-tooltip" data-title="Cisco"></li>
<li class="client carousel-item trans-all client-emirates amcharts-tooltip" data-title="Emirates"></li>
<li class="client carousel-item trans-all client-mailchimp amcharts-tooltip" data-title="MailChimp"></li>
<li class="client carousel-item trans-all client-hsbc amcharts-tooltip" data-title="HSBC"></li>
<li class="client carousel-item trans-all client-red-bull amcharts-tooltip" data-title="Red Bull"></li>
<li class="client carousel-item trans-all client-deutsche-bank amcharts-tooltip" data-title="Deutsche Bank"></li>
</ul>
</div>
</div>
<div class="extra-content alt-headers alt-bg">
<div class="entry-content content-col">
<h4 style="text-align: center;">What&#8217;s new with amCharts?</h4>
<div class="row margin-top-big">
<div class="col-md-4">
<h3>Recent blog posts</h3>
<ul class="widget widget-list with-icon">
<li><i class="icon icon-post smaller main-icon"></i><a href="https://www.amcharts.com/amcharts-wordpress-plugin-now-wpml-certified/">amCharts WordPress plugin is now WPML-certified</a><br/><span class="imp-low">08/11/2016</span></li>
<li><i class="icon icon-post smaller main-icon"></i><a href="https://www.amcharts.com/amcharts-react-component-now-available/">amCharts React component is now available</a><br/><span class="imp-low">08/11/2016</span></li>
<li><i class="icon icon-post smaller main-icon"></i><a href="https://www.amcharts.com/3204-with-accessibility-enhancements-automatic-grid-syncing/">New version 3.20.4 features accessibility enhancements and automatic grid syncing</a><br/><span class="imp-low">04/28/2016</span></li>
<li><i class="icon icon-post smaller main-icon"></i><a href="https://www.amcharts.com/3-20-accessibility-support/">Version 3.20.0 introduces accessibility support</a><br/><span class="imp-low">03/30/2016</span></li>
<li><i class="icon icon-post smaller main-icon"></i><a href="https://www.amcharts.com/version-318/">New massive update V3.18 brings a slew of exciting features</a><br/><span class="imp-low">12/14/2015</span></li>
</ul>
<p>&nbsp;</p>
<p><a class="button lite" href="https://www.amcharts.com/blog/">Visit blog</a></div>
<div class="col-md-4">
<h3>Latests tutorials and tips</h3>
<ul class="widget widget-list with-icon">
<li><i class="icon icon-tutorial smaller main-icon"></i><a href="https://www.amcharts.com/kbase/using-react/">Using amCharts 3 with React</a><br/><span class="imp-low">08/11/2016</span></li>
<li><i class="icon icon-tutorial smaller main-icon"></i><a href="https://www.amcharts.com/kbase/switching-amcharts-google-maps-based-zoom-level/">Switching between amCharts and Google Maps based on zoom level</a><br/><span class="imp-low">08/10/2016</span></li>
<li><i class="icon icon-tutorial smaller main-icon"></i><a href="https://www.amcharts.com/kbase/using-data-loader-functions-load-chart-csv-data/">Using Data Loader functions to load chart CSV data</a><br/><span class="imp-low">08/09/2016</span></li>
<li><i class="icon icon-tutorial smaller main-icon"></i><a href="https://www.amcharts.com/kbase/loading-external-csv-data-bubble-map/">Loading external CSV data for bubble map</a><br/><span class="imp-low">08/08/2016</span></li>
<li><i class="icon icon-tutorial smaller main-icon"></i><a href="https://www.amcharts.com/kbase/overriding-translating-default-export-menu-prompts/">Overriding (translating) default Export menu prompts</a><br/><span class="imp-low">08/08/2016</span></li>
<li><i class="icon icon-tutorial smaller main-icon"></i><a href="https://www.amcharts.com/kbase/paging-data-gantt-chart/">Paging data in GANTT chart</a><br/><span class="imp-low">08/06/2016</span></li>
</ul>
<p>&nbsp;</p>
<p><a class="button lite" href="https://www.amcharts.com/knowledge-base/">Visit Knowledge Base</a></div>
<div class="col-md-3 home-recent-demos">
<h3>Newest demos</h3>
<ul class="widget widget-list">
<li><a href="https://www.amcharts.com/demos/polar-scatter/"><img class="trans-all" src="https://www.amcharts.com/wp-content/uploads/2016/03/demo_6606_light.jpg"/><br/>Polar Scatter</a></li>
<li><a href="https://www.amcharts.com/demos/solid-gauge/"><img class="trans-all" src="https://www.amcharts.com/wp-content/uploads/2016/03/demo_6604_light.jpg"/><br/>Solid Gauge</a></li>
<li><a href="https://www.amcharts.com/demos/animated-time-line-pie-chart/"><img class="trans-all" src="https://www.amcharts.com/wp-content/uploads/2016/03/demo_6559_light-1.jpg"/><br/>Animated Time-Line Pie Chart</a></li>
</ul>
</div>
</div>
</div>
</div>
</article> 
</main> 
</div> 
</div> 
<footer class="site-footer" role="banner">
<div class="content-col">
<div class="row">
<div class="col-md-4 col-sm-12">
<div>
<a href="https://www.amcharts.com/" id="logo2" rel="home">amCharts</a>
</div> 
</div>
<div class="col-md-2 col-sm-4 col-xs-12">
<div role="navigation"><h4>More info</h4><div class="menu-info-container"><ul id="menu-info" class="menu"><li id="menu-item-76" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-76"><a href="https://groups.google.com/forum/#!forum/amcharts">Release Announcements</a></li>
<li id="menu-item-6844" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-6844"><a href="https://www.amcharts.com/accessibility/">Accessibility Features</a></li>
<li id="menu-item-81" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-81"><a href="https://www.amcharts.com/about/">About amCharts</a></li>
<li id="menu-item-7079" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-7079"><a href="https://www.amcharts.com/blog/">amCharts Blog</a></li>
</ul></div></div> </div>
<div class="col-md-2 col-sm-4 col-xs-12">
<div role="navigation"><h4>Products</h4><div class="menu-products-container"><ul id="menu-products" class="menu"><li id="menu-item-74" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-74"><a href="https://www.amcharts.com/javascript-charts/">JavaScript Charts</a></li>
<li id="menu-item-73" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-73"><a href="https://www.amcharts.com/stock-chart/">JavaScript Stock Chart</a></li>
<li id="menu-item-72" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-72"><a href="https://www.amcharts.com/javascript-maps/">JavaScript Maps</a></li>
<li id="menu-item-75" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-75"><a href="https://www.amcharts.com/products/">All products and tools</a></li>
</ul></div></div> </div>
<div class="col-md-2 col-sm-4 col-xs-12">
<div role="navigation"><h4>Tools</h4><div class="menu-tools-container"><ul id="menu-tools" class="menu"><li id="menu-item-83" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-83"><a href="https://live.amcharts.com/">Online Chart Editor</a></li>
<li id="menu-item-84" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-84"><a href="https://pixelmap.amcharts.com/">Pixel Map Generator</a></li>
<li id="menu-item-6845" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-6845"><a href="https://www.amcharts.com/visited_countries/">Visited Countries Map</a></li>
<li id="menu-item-6846" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-6846"><a href="https://www.amcharts.com/visited_states/">Visited States Map</a></li>
</ul></div></div> </div>
<div class="col-md-2 col-sm-4 col-xs-12">
<div role="navigation"><h4>Contact Us</h4><div class="menu-contact-container"><ul id="menu-contact" class="menu"><li id="menu-item-85" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-85"><a href="mailto:contact@amcharts.com">contact@amcharts.com</a></li>
<li id="menu-item-86" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-86"><a href="https://www.amcharts.com/support/">Support Center</a></li>
</ul></div></div> </div>
</div>
<div class="row">
<div class="col-md-8 col-md-push-4 col-sm-12 subfooter">
<div class="row">
<div class="col-md-6 col-sm-12 col-xs-12" role="nav">
<div class="menu-social-container"><ul id="social-menu" class="menu"><li id="menu-item-132" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-132"><a href="https://www.facebook.com/amcharts"><i class="icon icon-facebook"></i>Facebook</a></li>
<li id="menu-item-133" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-133"><a href="https://www.twitter.com/amcharts"><i class="icon icon-twitter"></i>Twitter</a></li>
<li id="menu-item-134" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-134"><a href="https://plus.google.com/+amcharts/"><i class="icon icon-google"></i>Google+</a></li>
<li id="menu-item-135" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-135"><a href="https://www.linkedin.com/company/amcharts"><i class="icon icon-linkedin"></i>LinkedIn</a></li>
</ul></div> </div>
<div class="col-md-6 col-sm-12 col-xs-12 pull-right" id="copyright" role="contentinfo">
Copyright © 2006-2016, amCharts. All rights reserved. </div>
</div>
</div>
</div>
</div>
</footer>
<script type='text/javascript' src='https://www.amcharts.com/lib/3/amcharts.js?ver=20160808-01'></script>
<script type='text/javascript' src='https://www.amcharts.com/lib/3/ammap.js?ver=20160808-01'></script>
<script type='text/javascript' src='https://www.amcharts.com/wp-content/themes/amcharts2/js/lazyload.js?ver=20160808-01'></script>
<script type='text/javascript' src='https://www.amcharts.com/wp-content/themes/amcharts2/js/main.js?ver=20160808-01'></script>
<script type='text/javascript' src='https://www.amcharts.com/wp-includes/js/jquery/ui/core.min.js?ver=1.11.4'></script>
<script type='text/javascript' src='https://www.amcharts.com/wp-includes/js/jquery/ui/widget.min.js?ver=1.11.4'></script>
<script type='text/javascript' src='https://www.amcharts.com/wp-includes/js/jquery/ui/mouse.min.js?ver=1.11.4'></script>
<script type='text/javascript' src='https://www.amcharts.com/wp-includes/js/jquery/ui/slider.min.js?ver=1.11.4'></script>
<script type='text/javascript' src='https://www.amcharts.com/wp-content/themes/amcharts2/js/jquery.ui.touch-punch.min.js?ver=20160808-01'></script>
<script type='text/javascript' src='https://www.amcharts.com/wp-content/themes/amcharts2/js/jquery.kinetic.min.js?ver=20160808-01'></script>
<script type='text/javascript' src='https://www.amcharts.com/wp-includes/js/wp-embed.min.js?ver=4.5.3'></script>
<script type='text/javascript' src='https://www.amcharts.com/lib/3/serial.js?ver=20160808-01'></script>
<script type='text/javascript' src='https://www.amcharts.com/lib/3/themes/light.js?ver=20160808-01'></script>
<script type='text/javascript' src='https://www.amcharts.com/lib/3/pie.js?ver=20160808-01'></script>
<script type='text/javascript' src='https://www.amcharts.com/lib/3/plugins/animate/animate.min.js?ver=20160808-01'></script>
<script type='text/javascript' src='https://www.amcharts.com/lib/3/amstock.js?ver=20160808-01'></script>
<script type='text/javascript' src='https://www.amcharts.com/lib/3/themes/dark.js?ver=20160808-01'></script>
<script type='text/javascript' src='https://www.amcharts.com/lib/3/maps/js/worldLow.js?ver=20160808-01'></script>
<script>
var chart = AmCharts.makeChart("chartdiv_304", {
  "type": "serial",
  "theme": "light",
  "addClassNames": true,
  "marginLeft": 25,
  "marginRight": 25,
  "marginTop": 45,
  "marginBottom": 0,
  "autoMarginOffset": 15,
  "startDuration": 2,
  "sequencedAnimation": false,
  "dataProvider": [ {
    "month": "JAN",
    "value1": 40,
    "value2": 15,
    "value3": 0,
    "value4": 20,
    "color": "#807fd3"
  }, {
    "month": "FEB",
    "value1": 10,
    "value2": 15,
    "value3": 0,
    "value4": 0,
    "color": "#6e6abc"
  }, {
    "month": "MAR",
    "value1": 40,
    "value2": 15,
    "value3": 0,
    "value4": 20,
    "color": "#807fd3"
  }, {
    "month": "APR",
    "value1": 22,
    "value2": 15,
    "value3": 0,
    "value4": 2,
    "color": "#6e6abc"
  }, {
    "month": "MAY",
    "value1": 53,
    "value2": 15,
    "value3": 0,
    "value4": 33,
    "color": "#807fd3"
  }, {
    "month": "JUN",
    "value1": 15,
    "value2": 15,
    "value3": 0,
    "value4": -5,
    "color": "#6e6abc"
  }, {
    "month": "JUL",
    "value1": 65,
    "value2": 15,
    "value3": 0,
    "value4": 45,
    "color": "#807fd3"
  }, {
    "month": "AUG",
    "value1": 30,
    "value2": 15,
    "value3": 0,
    "value4": 10,
    "color": "#6e6abc"
  }, {
    "month": "SEP",
    "value1": 58,
    "value2": 15,
    "value3": 0,
    "value4": 38,
    "color": "#807fd3"
  }, {
    "month": "OCT",
    "value1": 15,
    "value2": 15,
    "value3": 0,
    "value4": -5,
    "color": "#6e6abc"
  }, {
    "month": "NOV",
    "value1": 68,
    "value2": 15,
    "value3": 0,
    "value4": 48,
    "color": "#807fd3"
  }, {
    "month": "DEC",
    "value1": 77,
    "value2": 15,
    "value3": 0,
    "value4": 62,
    "color": "#6e6abc"
  }],
  "graphs": [{
    "id": "g1",
    "lineAlpha": 0,
    "lineThickness": 3,
    "valueField": "value1",
    "showBalloon": false
  }, {
    "id": "g2",
    "lineAlpha": 0,
    "lineColor": "#fff",
    "lineThickness": 0,
    "fillColors": "#807fd3",
    "fillColorsField": "color",
    "fillAlphas": 1,
    "valueField": "value2",
    "showBalloon": false
  }, {
    "id": "g3",
    "lineAlpha": 1,
    "lineColor": "#fff",
    "lineThickness": 5,
    "valueField": "value3",
    "balloonColor": "#5fb3f3",
    "balloonText": "[[value1]]",
    "balloon": {
      "drop": true,
      "adjustBorderColor": false,
      "color": "#ffffff"      
    }
  }, {
    "id": "g4",
    "lineAlpha": 1,
    "lineColor": "#000",
    "lineThickness": 10,
    "valueField": "value4",
    "showBalloon": false,
    "stackable": false,
    "lineAlpha": 0.6
    }
  ],
  "categoryField": "month",
  "categoryAxis": {
    "color": "#8a86c7",
    "axisColor": "#5957b1",
    "gridAlpha": 0,
    "startOnAxis": false,
    "balloon":{
      "fillAlpha":1,
      "fontSize":15,
      "horizontalPadding":10
    }
  },
  "valueAxes": [{
    "stackType": "regular",
    "gridAlpha": 1,
    "gridColor": "#5957b1",
    "axisAlpha": 0,
    "labelsEnabled": false,
    "minimum": 0,
    "maximum": 100,
    "ignoreAxisWidth": true
  }],
  "balloon": {
    "borderThickness": 0,
    "shadowAlpha": 0,
    "fontSize": 18
  },
  "chartCursor": {
    "cursorAlpha": 0.7,
    "cursorColor": "#5fb3f3",
    "limitToGraph": "g3",
    "categoryBalloonColor": "#5e59b9",
    "categoryBalloonAlpha": 1,
    "zoomable": false
  },
  "defs": {
    "filter": [{
      "x": "-50%",
      "y": "-50%",
      "width": "200%",
      "height": "200%",
      "id": "blur",
      "feGaussianBlur": {
        "in": "SourceGraphic",
        "stdDeviation": "15"
      }
    }]
  }
});</script>
<script>
var chart = AmCharts.makeChart("chartdiv_6867", {
  "type": "serial",
  "theme": "light",
  "marginTop": 30,
  "autoMarginOffset": 20,
  "marginRight": 30,
  "marginBottom": 30,
  "backgroundAlpha": 1,
  "backgroundColor": "#357cd2",
  "color": "#679cdd",
  "dataProvider": [{
    "year": "2000",
    "sales": 7,
    "sales2": 8
  }, {
    "year": "2001",
    "sales": 8,
    "sales2": 8.9
  }, {
    "year": "2002",
    "sales": 8.5,
    "sales2": 10
  }, {
    "year": "2003",
    "sales": 8,
    "sales2": 10.2
  }, {
    "year": "2004",
    "sales": 8.7,
    "sales2": 9.5
  }, {
    "year": "2005",
    "sales": 9.2,
    "sales2": 11.1
  }, {
    "year": "2006",
    "sales": 8,
    "sales2": 8.5
  }, {
    "year": "2007",
    "sales": 7.3,
    "sales2": 8
  }, {
    "year": "2008",
    "sales": 8,
    "sales2": 9.2
  }, {
    "year": "2009",
    "sales": 8.1,
    "sales2": 8.9
  }, {
    "year": "2010",
    "sales": 8.5,
    "sales2": 9.3
  }, {
    "year": "2011",
    "sales": 9.2,
    "sales2": 9.9
  }, {
    "year": "2012",
    "sales": 9.4,
    "sales2": 10.2
  }, {
    "year": "2013",
    "sales": 10.3,
    "sales2": 11.1
  }, {
    "year": "2014",
    "sales": 11,
    "sales2": 12
  }, {
    "year": "2015",
    "sales": 11.5,
    "sales2": 12.2
  }, {
    "year": "2016",
    "sales": 11.9,
    "sales2": 12.8
  }],
  "graphs": [{
    "title": "Division sales",
    "lineColor": "#00bdae",
    "lineAlpha": 1,
    "fillAlphas": 1,
    "type": "column",
    "columnWidth": 0.2,
    "valueField": "sales",
    "balloon":{
      "color":"#FFFFFF"
    },    
    "balloonText": "[[title]]<br /><span style='font-size: 16px;'>$[[value]]M</span>"
  }, {
    "title": "Group",
    "lineColor": "#fff",
    "lineAlpha": 0.7,
    "lineThickness": 2,
    "bulletAlpha": 1,
    "bullet": "round",
    "bulletBorderThickness": 2,
    "bulletBorderAlpha": 1,
    "bulletSize": 10,
    "bulletColor": "#357cd2",
    "useLineColorForBulletBorder": true,
    "valueField": "sales2",
    "balloonText": "[[title]]<br /><span style='font-size: 16px;'>$[[value]]M</span>"
  }],
  "categoryField": "year",
  "categoryAxis": {
    "axisAlpha": 0,
    "gridAlpha": 0,
    "labelsEnabled": false,
    "ignoreAxisWidth": true
  },
  "valueAxes": [{
    "gridColor": "#4a89d7",
    "gridAlpha": 1,
    "axisAlpha": 0
  }],
  "chartCursor": {
    "cursorAlpha": 0,
    "categoryBalloonEnabled": false
  },
  "balloon":{
    "adjustBorderColor":false,
    "borderThickness":1
  }
});</script>
<script>
var chart = AmCharts.makeChart("chartdiv_8258", {
  "type": "serial",
  "theme": "light",
  "marginTop": 50,
  "marginBottom": 30,
  "marginLeft": 30,
  "marginRight": 30,
  "autoMargins": false,
  "color": "#6ab7f3",
  "dataProvider": [{
    "category": "MON",
    "value1": 5,
    "value2": 12
  }, {
    "category": "TUE",
    "value1": 19,
    "value2": 12
  }, {
    "category": "WED",
    "value1": 32,
    "value2": 12
  }, {
    "category": "THU",
    "value1": 22,
    "value2": 12
  }, {
    "category": "FRI",
    "value1": 31,
    "value2": 12
  }, {
    "category": "SAT",
    "value1": 41,
    "value2": 12
  }, {
    "category": "SUN",
    "value1": 22,
    "value2": 12
  }],
  "graphs": [{
    "lineColor": "#6ab7f3",
    "title": "Web Sales",
    "fillAlphas": 1,
    "lineAlpha": 1,
    "type": "column",
    "valueField": "value1",
    "balloonText": "[[title]]<br /><span style='font-size: 16px;'>$[[value]]M</span>"
  }, {
    "lineColor": "#736dba",
    "title": "Retail Sales",
    "fillAlphas": 1,
    "lineAlpha": 1,
    "type": "column",
    "valueField": "value2",
    "balloonText": "[[title]]<br /><span style='font-size: 16px;'>$[[value]]M</span>"
  }],
  "categoryField": "category",
  "categoryAxis": {
    "position": "top",
    "gridAlpha": 0,
    "axisAlpha": 0,
    "color": "#aaa",
    "tickLength": 0,
    "guides": [{
      "label": "17",
      "category": "MON",
      "inside": true,
      "fontSize": 25,
      "color": "#6ab7f3"
    }, {
      "label": "31",
      "category": "TUE",
      "inside": true,
      "fontSize": 25,
      "color": "#6ab7f3"
    }, {
      "label": "44",
      "category": "WED",
      "inside": true,
      "fontSize": 25,
      "color": "#6ab7f3"
    }, {
      "label": "34",
      "category": "THU",
      "inside": true,
      "fontSize": 25,
      "color": "#6ab7f3"
    }, {
      "label": "43",
      "category": "FRI",
      "inside": true,
      "fontSize": 25,
      "color": "#6ab7f3"
    }, {
      "label": "53",
      "category": "SAT",
      "inside": true,
      "fontSize": 25,
      "color": "#6ab7f3"
    }, {
      "label": "34",
      "category": "SUN",
      "inside": true,
      "fontSize": 25,
      "color": "#6ab7f3"
    }]
  },
  "valueAxes": [{
    "stackType": "regular",
    "axisAlpha": 0,
    "gridAlpha": 0,
    "labelsEnabled": false,
    "maximum": 70
  }],
  "chartCursor": {
    "fullWidth": true,
    "cursorAlpha": 0.1,
    "lineAlpha": 0.1,
    "cursorColor": "#736dba",
    "categoryBalloonColor": "#736dba"
  },
  "balloon": {
    "adjustBorderColor": false,
    "borderAlpha": 1,
    "shadowAlpha": 0,
    "borderThickness": 1,
    "fillAlpha": 1,
    "color": "#fff"
  }
});</script>
<script>
var chartData = [
  [{
    "answer": "Yes",
    "value": 35109,
    "color": "#00bdae"
  }, {
    "answer": "No",
    "value": 32010,
    "color": "#357cd2"
  }, {
    "answer": "I don't know",
    "value": 5110,
    "color": "#736dba"
  }],
  [{
    "answer": "Yes",
    "value": 32111,
    "color": "#00bdae"
  }, {
    "answer": "No",
    "value": 36116,
    "color": "#357cd2"
  }, {
    "answer": "I don't know",
    "value": 2090,
    "color": "#736dba"
  }],
  [{
    "answer": "Yes",
    "value": 24995,
    "color": "#00bdae"
  }, {
    "answer": "No",
    "value": 48109,
    "color": "#357cd2"
  }, {
    "answer": "I don't know",
    "value": 6110,
    "color": "#736dba"
  }],
  [{
    "answer": "Yes",
    "value": 41561,
    "color": "#00bdae"
  }, {
    "answer": "No",
    "value": 32222,
    "color": "#357cd2"
  }, {
    "answer": "I don't know",
    "value": 6055,
    "color": "#736dba"
  }],
  [{
    "answer": "Yes",
    "value": 45695,
    "color": "#00bdae"
  }, {
    "answer": "No",
    "value": 26843,
    "color": "#357cd2"
  }, {
    "answer": "I don't know",
    "value": 4400,
    "color": "#736dba"
  }]
];

var chart = AmCharts.makeChart("chartdiv_8272", {
  "type": "pie",
  "startDuration": 0,
  "theme": "light",
  "balloon":{
    "adjustBorderColor":false,
    "color":"#FFFFFF"
  },
  "addClassNames": true,
  "innerRadius": "30%",
  "pullOutRadius": 0,
  "autoMargins": false,
  "marginTop": 0,
  "marginBottom": 0,
  "marginLeft": 0,
  "marginRight": 0,
  "color": "#357cd2",
  "fontSize":16,
  "outlineThickness":2,
  "outlineAlpha":1,
  "dataProvider": chartData[0],
  "valueField": "value",
  "titleField": "answer",
  "colorField": "color",
    "listeners": [ {
    "event": "init",
    "method": function( e ) {
      var chart = e.chart, current = 0;
      
      function getCurrentData() {
        var data = chartData[current];
        current++;
        if (current > (chartData.length - 1) )
          current = 0;
        return data;
      }

      function loop() {
        var data = getCurrentData();
        chart.animateData( data, {
          duration: 1000,
          complete: function() {
            setTimeout( loop, 2000 );
          }
        } );
      }

      loop();
    }
  } ]
});</script>
<script>
var chartData1 = [];
var chartData2 = [];
var chartData3 = [];
var chartData4 = [];

generateChartData();

function generateChartData() {
  var firstDate = new Date();
  firstDate.setDate( firstDate.getDate() - 500 );
  firstDate.setHours( 0, 0, 0, 0 );

  for ( var i = 0; i < 500; i++ ) {
    var newDate = new Date( firstDate );
    newDate.setDate( newDate.getDate() + i );

    var a1 = Math.round( Math.random() * ( 40 + i ) ) + 100 + i;
    var b1 = Math.round( Math.random() * ( 1000 + i ) ) + 500 + i * 2;

    var a2 = Math.round( Math.random() * ( 100 + i ) ) + 200 + i;
    var b2 = Math.round( Math.random() * ( 1000 + i ) ) + 600 + i * 2;

    var a3 = Math.round( Math.random() * ( 100 + i ) ) + 200;
    var b3 = Math.round( Math.random() * ( 1000 + i ) ) + 600 + i * 2;

    var a4 = Math.round( Math.random() * ( 100 + i ) ) + 200 + i;
    var b4 = Math.round( Math.random() * ( 100 + i ) ) + 600 + i;

    chartData1.push( {
      "date": newDate,
      "value": a1,
      "volume": b1
    } );
    chartData2.push( {
      "date": newDate,
      "value": a2,
      "volume": b2
    } );
    chartData3.push( {
      "date": newDate,
      "value": a3,
      "volume": b3
    } );
    chartData4.push( {
      "date": newDate,
      "value": a4,
      "volume": b4
    } );
  }
}

var chart = AmCharts.makeChart( "chartdiv_6869", {
  "type": "stock",
  "theme": "dark",

  "dataSets": [ {
      "title": "first data set",
      "fieldMappings": [ {
        "fromField": "value",
        "toField": "value"
      }, {
        "fromField": "volume",
        "toField": "volume"
      } ],
      "dataProvider": chartData1,
      "categoryField": "date"
    }, {
      "title": "second data set",
      "fieldMappings": [ {
        "fromField": "value",
        "toField": "value"
      }, {
        "fromField": "volume",
        "toField": "volume"
      } ],
      "dataProvider": chartData2,
      "categoryField": "date",
      "compared": true
    }, {
      "title": "third data set",
      "fieldMappings": [ {
        "fromField": "value",
        "toField": "value"
      }, {
        "fromField": "volume",
        "toField": "volume"
      } ],
      "dataProvider": chartData3,
      "categoryField": "date",
      "compared": true
    }, {
      "title": "fourth data set",
      "fieldMappings": [ {
        "fromField": "value",
        "toField": "value"
      }, {
        "fromField": "volume",
        "toField": "volume"
      } ],
      "dataProvider": chartData4,
      "categoryField": "date",
      "compared": true
    }
  ],

  "panels": [ {
    "showCategoryAxis": false,
    "title": "Value",
    "percentHeight": 70,
    "stockGraphs": [ {
      "id": "g1",
      "valueField": "value",
      "comparable": true,
      "lineThickness": 2,
      "compareField": "value",
      "balloonText": "[[title]]:<b>[[value]]</b>",
      "compareGraph": {
        "lineThickness": 2,
        "balloonText": "[[title]]:<b>[[value]]</b>"
      }
    } ],
    "stockLegend": {
      "periodValueTextComparing": "[[percents.value.close]]%",
      "periodValueTextRegular": "[[value.close]]"
    }
  }, {
    "title": "Volume",
    "percentHeight": 30,
    "stockGraphs": [ {
      "valueField": "volume",
      "type": "column",
      "showBalloon": false,
      "fillAlphas": 1
    } ],
    "stockLegend": {
      "periodValueTextRegular": "[[value.close]]"
    }
  } ],

  "chartScrollbarSettings": {
    "graph": "g1"
  },

  "chartCursorSettings": {
    "valueBalloonsEnabled": true,
    "fullWidth": true,
    "cursorAlpha": 0.1,
    "valueLineBalloonEnabled": true,
    "valueLineEnabled": true,
    "valueLineAlpha": 0.5
  },

  "periodSelector": {
    "fromText": "",
    "toText": "-",
    "periodsText": "",
    "position": "bottom",
    "periods": [ {
      "period": "MM",
      "selected": true,
      "count": 1,
      "label": "1 month"
    }, {
      "period": "YYYY",
      "count": 1,
      "label": "1 year"
    }, {
      "period": "YTD",
      "label": "YTD"
    }, {
      "period": "MAX",
      "label": "MAX"
    } ]
  }
} );</script>
<script>
// svg path for target icon
var targetSVG = "M9,0C4.029,0,0,4.029,0,9s4.029,9,9,9s9-4.029,9-9S13.971,0,9,0z M9,15.93 c-3.83,0-6.93-3.1-6.93-6.93S5.17,2.07,9,2.07s6.93,3.1,6.93,6.93S12.83,15.93,9,15.93 M12.5,9c0,1.933-1.567,3.5-3.5,3.5S5.5,10.933,5.5,9S7.067,5.5,9,5.5 S12.5,7.067,12.5,9z";
// svg path for plane icon
var planeSVG = "m2,106h28l24,30h72l-44,-133h35l80,132h98c21,0 21,34 0,34l-98,0 -80,134h-35l43,-133h-71l-24,30h-28l15,-47";


window.map = AmCharts.makeChart( "chartdiv_6847", {
  "type": "map",
"theme": "light",
  "dataProvider": {
    "map": "worldLow",
    "zoomLevel": 3.5,
    "zoomLongitude": -55,
    "zoomLatitude": 42,

    "lines": [ {
      "id": "line1",
      "arc": -0.85,
      "alpha": 0.3,
      "latitudes": [ 48.8567, 43.8163, 34.3, 23 ],
      "longitudes": [ 2.3510, -79.4287, -118.15, -82 ]
    }, {
      "id": "line2",
      "alpha": 0,
      "color": "#000000",
      "latitudes": [ 48.8567, 43.8163, 34.3, 23 ],
      "longitudes": [ 2.3510, -79.4287, -118.15, -82 ]
    } ],
    "images": [ {
      "svgPath": targetSVG,
      "title": "Paris",
      "latitude": 48.8567,
      "longitude": 2.3510
    }, {
      "svgPath": targetSVG,
      "title": "Toronto",
      "latitude": 43.8163,
      "longitude": -79.4287
    }, {
      "svgPath": targetSVG,
      "title": "Los Angeles",
      "latitude": 34.3,
      "longitude": -118.15
    }, {
      "svgPath": targetSVG,
      "title": "Havana",
      "latitude": 23,
      "longitude": -82
    }, {
      "svgPath": planeSVG,
      "positionOnLine": 0,
      "color": "#000000",
      "alpha": 0.1,
      "animateAlongLine": true,
      "lineId": "line2",
      "flipDirection": true,
      "loop": true,
      "scale": 0.03,
      "positionScale": 1.3
    }, {
      "svgPath": planeSVG,
      "positionOnLine": 0,
      "color": "#585869",
      "animateAlongLine": true,
      "lineId": "line1",
      "flipDirection": true,
      "loop": true,
      "scale": 0.03,
      "positionScale": 1.8
    } ]
  },

  "areasSettings": {
    "unlistedAreasColor": "#8dd9ef"
  },

  "imagesSettings": {
    "color": "#585869",
    "rollOverColor": "#585869",
    "selectedColor": "#585869",
    "pauseDuration": 0.2,
    "animationDuration": 2.5,
    "adjustAnimationSpeed": true
  },

  "linesSettings": {
    "color": "#585869",
    "alpha": 0.4
  },

  "zoomControl": {
    "zoomControlEnabled": false
  },

  "export": {
    "enabled": true
  }

} );</script>
<script>
  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
  })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');

  ga('create', 'UA-22221037-1', 'auto');
  ga('send', 'pageview');
  ga('require', 'linker');
</script>
</body>
</html>
