Chat with us, powered by LiveChat

Archive for the AnyChart charting component

Data Visualization for COVID-19 Dashboard Tracker Using AnyChart JS Charts

April 12th, 2021 by AnyChart Team

COVID-19 Dashboard Tracker Using AnyChart JS Charts for Interactive Data VisualizationData visualization has played an important role during the COVID-19 pandemic, allowing governments, scientists, healthcare professionals, and the general public to better understand different aspects of the crisis. There are many illuminating projects all over the web that leverage charts and maps to effectively communicate what the coronavirus statistics have to say. Some of them are using our data visualization tools under a free license provided as part of the special initiative we announced last spring to support the global COVID-19 data analysis effort.

We told you about two examples of such projects earlier: StopCorona and iConcepts SARS-CoV-2 Stats. Now let us introduce you to another interesting resource — COVID-19 Dashboard Tracker by Maxime des Touches. Launched more than a year ago, while Maxime was yet a computer science student, it has turned from a simple online data table into a complex interactive data visualization project offering up-to-date insight into how the pandemic unfolds in France and worldwide.

Maxime kindly agreed to talk to us about his COVID-19 tracker, experience using AnyChart, and the pandemic in general. Check out our quick interview, glance at a few screenshots, and try his open-source dashboard by yourself. (Stack: HTML/jQuery/JSON.)

Read more »


Creating a Waterfall Chart with JS

March 16th, 2021 by Dilhani Withanage

A Waterfall Chart with JSDo you want to know how to easily add a waterfall chart to a web page or application using JavaScript? This tutorial will make sure you’re prepared to confidently deal with that sort of interactive data visualization development!

Waterfall charts illuminate how a starting value turns into a final value over a sequence of intermediate additions (positive values) and subtractions (negative values). These additions and subtractions can be time-based or represent categories such as multiple income sources and expenditures. In finance, a waterfall chart is often called a bridge; you may have also heard it referred to as a cascade, Mario, or flying bricks chart.

To see waterfall charts in action and learn how to build them with JavaScript (HTML5), we need some interesting real-world data to visualize. In this tutorial, let’s look at the 2020 income statement for Alphabet Inc. (GOOGL), the parent company of Google.

Hence, be with me to reach our target step by step, so in the end, you’ll see how a lot of numbers can be made sense of with real ease when illustrated as a beautiful, interactive, JS waterfall chart. All aboard!

Read more »


Bullseye Chart and Gantt Chart Improvements in Qlik Sense Extensions by AnyChart

March 8th, 2021 by AnyChart Team

Bullseye chart in Qlik Sense announced🎯 Bam! Meet Bullseye charts in Qlik Sense! Qlik counted on us to provide its customers with “additional choices for building even more compelling visualizations.” And we could not stop innovating, so Bullseye has become the 42nd chart type in AnyChart’s extensions for Qlik Sense — enjoy and hit the bull’s-eye in data-driven decision making!

Also, we have added new awesome features to our Gantt charts in Qlik Sense to help expedite actionable insights into your project data. Learn more about the highlights of the March 2021 release of the AnyChart and AnyGantt extensions in a quick overview, and download the latest version!

Read more at qlik.anychart.com »


How to Create Diverging Bar Chart with JavaScript

March 2nd, 2021 by Shachee Swadia

This article is a step-by-step guide that’ll show you how to build an interactive JavaScript range chart that visualizes 20 years of the LA Lakers’ performance with Kobe Bryant.

The year 2020 was pretty poignant for obvious reasons. But even before the pandemic, the year started on a sad note with the death of basketball legend Kobe Bryant. He was a star NBA athlete who had played for 20 years with one and only one team — the Los Angeles Lakers.

Remembering Kobe one year after that horrible crash, I wondered how the Lakers had performed in his two-decade era. So, I visualized that in an interactive Diverging Bar Chart with the help of pure JavaScript.

Thinking that this project might be helpful for those new to web charting, I also logged the entire process and made a tutorial. Check it out!

Read more »


How to Build a Pareto Chart in JavaScript

February 16th, 2021 by Dilhani Withanage

Pareto chart created in JavaScript being shownCreating a Pareto chart with JavaScript for HTML5 apps and websites is not a complicated or hectic development process at all. Get hands-on experience with this tutorial and you will find data visualization in such a form joyful and exciting!

Before we start, let’s remember how Pareto charts look and what their purpose is, just to make sure we are on the same page. A Pareto chart, also a Pareto diagram, is a combination of vertical bars (columns) and a line graph. Columns are used to depict values and are displayed in descending order, left to right. The line in a Pareto chart shows the cumulative total in percentages. Such a visualization helps data scientists and analysts quickly identify the most important among a set of factors, i.e. those characterized by the largest values and therefore making the most significant contribution to the total across all the represented factors.

In this JS Pareto chart tutorial, we’ll be visualizing statistics for the leading causes of death in the United States in 2019 and find out what claimed the most American lives during that year according to official data.

Now let’s move to JavaScript charting, and more precisely, building an interactive Pareto chart using JS!

Read more »


Creating JavaScript Angular Gauge

February 3rd, 2021 by Shachee Swadia

Angular gauge in JavaScript on a laptop screen visualizing Grammys Record of the Year nominee songs popularity based on Spotify dataWould you like to add another really cool and interesting chart to your data visualization portfolio? Follow this simple tutorial and you’ll learn how to create a beautiful and interactive Angular Gauge using JavaScript, with ease!

An Angular Gauge, also known as a Circular Gauge, is a type of gauge chart with a radial scale. Such visualizations can nicely show a value within a range and are widely used in various dashboards.

The recent good news of vaccines feels like music to our ears. So, I thought why not take some interesting music data for visualization in this tutorial! The 63rd annual Grammy Awards ceremony will be held in March 2021, and when I looked through the list of the Record of the Year nominees, I wondered how popular each of these songs is. To find out, I decided to look at the number of their streams on Spotify, one of the world’s leading music streaming platforms, and thought that a Solid Angular Gauge could work well in such a visual analysis. It also resembles a vinyl record, which makes it an especially interesting chart type to opt for when representing such data!

So, along the tutorial, I will be visualizing Spotify stream counts for each 2021 GRAMMYs Record of the Year nominee song in a JS Angular Gauge chart. That is going to be entertaining! All aboard!

Read more »


How to Create Bubble Map with JavaScript to Visualize Election Results

January 25th, 2021 by Shachee Swadia

Bubble Map created with JavaScript visualizing election resultsIn these times of exponentially growing data, visualization is a necessary skillset to have in your tool box. Popular techniques include bar charts, line graphs, pie charts, and bubble maps among others.

Building interactive charts from scratch with JavaScript can be a difficult endeavor for any developer, especially someone starting out new. That is exactly why we have JS charting libraries which make it much easier and quicker to conjure up insightful visualizations!

Read on to see how I create a JavaScript Bubble Map with one of these libraries.

Read more »


Building a Marimekko Chart with JavaScript

December 22nd, 2020 by Dilhani Withanage

A Marimekko Chart built with JavaScript displayed on a laptop screenWould you like to know how to easily create an interactive Marimekko chart for HTML5 based apps and Web pages using JavaScript? If yes, you are on the best path to learning this.

Also known as Mekko charts and market maps, Marimekko charts display numerical values that vary from 0% to 100% in its Y-axis. The most exciting part lies in their X-axis, which indicates the sum of values within categories. Each category’s width along the X-axis portraits the whole category’s contribution to a total of all data. In simple words, this is a type of a stacked chart that visualizes categorical data. Still, both the Y and X axes vary in a percentage scale by determining each segment’s width and height.

Are you a smartphone enthusiast and interested to look at the global smartphone shipments in 2019 by quarter and by vendor? Then especially follow the present tutorial as we are to visualize this market data in an elegant Marimekko diagram using simple JS chart coding techniques.

Read more »


How I Created a Sunburst Chart Using JavaScript to Visualize COVID-19 Data

December 8th, 2020 by Shachee Swadia

A tutorial on how to create a sunburst chart using JavaScript to visualize COVID-19 dataAlmost recovered from COVID-19 myself these days, I decided to explore how the world is currently doing, during the pandemic. So I created a sunburst chart to see at a glance what continents and countries are more (and less) affected by the coronavirus than others. The process was quick and I thought someone could be interested to learn about how such data visualizations can be built in a pretty straightforward way, even with very little technical skills. So I also made a tutorial. And here I am — (1) sharing my interactive sunburst chart of COVID cases and (2) describing how I created it using JavaScript in a matter of minutes, step by step!

My JS sunburst chart provides an overview of the situation as of November 24, 2020, and also shows the global count, continent-wide data, and country-wise proportions for the current active COVID-19 cases and deaths. Scroll down to explore it by yourself and check out the tutorial along the way. Here is a sneak peek of the final chart to get you excited:

JavaScript Sunburst Chart to be created

This sunburst charting tutorial is mainly for beginners to data science. So before we get to business, let’s make sure we’re on the same page. I’ll explain what a sunburst chart is and how it works, to start with. Then I’ll show you how to create a cool and colorful interactive visualization like that with JavaScript (and you can do it even if you don’t know it too well). That’s the plan!

Read the JS charting tutorial »


Mais Hatem Visualizes Reddit Data Using AnyChart JS Charting Library

November 25th, 2020 by AnyChart Team

A Word Cloud chart visualizing Reddit data using the AnyChart JavaScript charting libraryLeading the data visualization market with the best-in-class solutions, we are always excited to see how not only companies but also individuals from all over the world use them to produce interactive charts in their projects. Here’s one new interesting example we’ve recently learned about. Mais Hatem from Syria, currently an undergraduate at the American University of Beirut (Lebanon), created “Cloud a Subreddit,” a web project that generates a beautiful interactive Word Cloud chart out of any given Reddit’s subreddit with the help of the AnyChart JS library.

We had a quick interview with Mais where she told us more about her work and experience using AnyChart. Check it out.

Read more »