Chat with us, powered by LiveChat

Archive for the JavaScript

How to Build Surface Chart Using JavaScript

December 15th, 2021 by Shachee Swadia

How to Build a Surface Chart Using JavaScriptData visualization is a must-have skill today with ever-growing data and the need to analyze as well as present that data. You will definitely come across data charts whether you are in the technology industry or not and therefore, it is a good idea to learn how to build visualizations.

I will show you here that building charts is not very tough and with the right tools, you can start creating interactive, interesting visualizations in little time and effort!

In this step-by-step tutorial, I will demonstrate how to represent GDP values of various countries for the past 15 years on a beautiful interactive 3D surface chart using a JavaScript library for data visualization.

The surface plot looks quite complex, but I will show you how straightforward it is to make a compelling and fully functional one.

Read the JS charting tutorial »


AnyChart JS Charts 8.11.0 Released with Awesome New Data Visualization Features

December 7th, 2021 by AnyChart Team

AnyChart JS Charts 8.11.0 Released with Awesome New Data Visualization FeaturesExcited to tell you we’ve just pushed a major update to our JavaScript charting library! The newly arrived features and improvements make our core solution even more flexible, adding awesome fresh capabilities designed to further help you on your data visualization development journey. Intrigued? Let us show what’s new in AnyChart JS Charts 8.11.0 right away!

»»» See What’s New in AnyChart 8.11.0! «««


How to Make JavaScript Polar Chart

November 11th, 2021 by Shachee Swadia

A JavaScript polar chart making tutorial based on DVS survey dataPolar charts often look impressive, which makes some people think that creating them is a tricky process demanding plenty of skills and expertise. Well, I am going to debunk this myth right now! Let me show you how to easily visualize data in a beautiful interactive JavaScript Polar Chart.

Fundamentally, a polar chart is a variation of a circular graph drawn with polar coordinates. It can also work well to visualize some sorts of categorical data for comparisons, which is exactly the case I want to demonstrate now. In this tutorial, I will build a column polar chart, with the bars growing from the center of the diagram to represent values with their length.

Data Visualization Society (DVS) conducts an annual State of the Industry survey of data viz practitioners, and I thought it could be a great opportunity to play with some of its latest data. In particular, I wanted to look at the most popular technologies used for data visualization based on the responses. So here, I will produce a JS polar chart that plots the top 15 ones, making up a cool illustrative real-world example.

It will be fun — come along, everyone!

Read the JS charting tutorial »


Creating Linear Gauge Chart in JavaScript — Tutorial

October 20th, 2021 by Shachee Swadia

A laptop showing an interactive Linear Gauge Chart explained and created in JavaScript along this data visualization tutorialThis article presents an easy-to-follow guide for building an interactive linear gauge chart in JavaScript.

We’ll show how to quickly create a cool and interactive linear gauge chart that highlights Covid-19 vaccination data around the world. Our chart will allow us to visualize the status of Covid-19 vaccination at the time of writing, and will display two types of data — showing how far away we are from the halfway target of both partially and fully vaccinating the global population.

Read the JS charting tutorial »


Building Word Tree Chart with JavaScript

October 4th, 2021 by Shachee Swadia

Word Tree Chart built with JavaScript HTML5 on a screenData visualization is not only useful for communicating insights but also helpful for data exploration. There are a whole lot of different chart types that are widely used for identifying patterns in data. One of the lesser-used chart types is Word Tree. It is a very interesting visualization form, quite effective in analyzing texts. And right now, I will teach you how to quickly create nice interactive word tree charts using JavaScript.

Word trees display how a set of selected words are connected to other words in text data with a branching layout. These charts are similar to word clouds where words that occur more frequently are shown bigger. But they are different in the sense that word trees also show the connection between the words, which adds context and helps find patterns.

In this tutorial, I will create a lovely word tree from the text of the very famous book The Little Prince by French aviator and writer Antoine de Saint-Exupéry. Check out a demonstration of the final chart below and keep reading to learn how this and any other interactive JS word tree can be built with ease.

Read the JS charting tutorial »


AnyChart Used for Data Visualization in Open-Source Redis Inventory Tool

September 29th, 2021 by AnyChart Team

A sunburst diagram in open-source Redis Inventory tool, visualizing Redis memory usage hierarchically, built with the AnyChart JavaScript charting librarySunburst charts are known to be greatly useful for visualizing hierarchical data structures. So it is no surprise that this chart type became a big hit among our users immediately after we added it to the AnyChart JavaScript library. Because the core of our global customer base is enterprise clients, most of the real-world use cases for our JS sunburst chart are hidden in internal corporate apps. But AnyChart is often picked for data visualization in open projects as well, and we invite you to see a super cool example we have recently found out about — Redis Inventory. It is an open-source tool that makes it easy to view Redis memory usage by key patterns in a hierarchical way, with an interactive sunburst chart in action.

Learn more about Redis Inventory and how AnyChart is used there from our quick interview with its creator Aleksandr Obukhov. (Stack: Go/Cobra/Redis.)

Read more »


How to Build Interactive Connector Map with JavaScript

September 21st, 2021 by Shachee Swadia

Building an Interactive Connector Map for a Web Page or App with JavaScript HTML5A connector map is a set of straight or curved lines that link points on a geographical map. It is commonly used to graphically represent routes or any other connections between locations. Would you like to learn how to build an attractive data visualization like that for a web page or app?

Actually, it is easy to create an interactive connector map using JavaScript. And I am ready to show you how right now! Follow along with this tutorial as I depict the cycling path of the 2021 Tour de France in the form of a JS connector map and thoroughly explain all steps.

Read the JS charting tutorial »


AnyChart Used to Power Charts in Data Science Teaching Project Made at Edinburgh Napier University

September 16th, 2021 by AnyChart Team

JavaScript charts powered by AnyChart in a data science teaching website project created at Edinburgh Napier UniversityAt AnyChart, we are eager to support education projects by letting their creators work gratis with the same data visualization solutions used by the world’s leading companies to build interactive charts.

Recently, a group of students at Edinburgh Napier University — including Martin McVey, Tibor Toth, Daniel Glen, Flynn Kearney, David Stewart, and John Frampton — reached out to us as they were building a website to assist with the learning of data science. And we were more than happy to provide them with a free license for the use of our JavaScript charting library.

The website is now available to the public, presenting a wide range of chart types with real-world examples along with questions and answers. Acknowledged as one of the top projects in the university year and awarded with a prize from Computershare, it is to be used for teaching about data visualization and analytics in Scottish schools.

We thought you could be interested to not only check out the website but also learn some more about the project and its developers’ experience with AnyChart. So we had a quick talk on that with Martin McVey from the team. Read below.

Read more »


How to Create Financial Open-High-Low-Close (OHLC) Chart Using JavaScript

September 7th, 2021 by Shachee Swadia

Interactive Open-High-Low-Close (OHLC) chart built with JavaScript on a laptop screenA stepwise guide on how to create interactive financial charts in the form of an OHLC chart. Visualizing the stock prices of Amazon over the course of Jeff Bezos’s tenure as the CEO.

Financial charts are especially useful to represent large amounts of data and identify trends. Would like to learn one such cool financial chart called the OHLC chart that visualizes stock price movement?

Read the JS charting tutorial »


Cesefor Uses AnyChart to Visualize Forestry Data in Nemus System

August 31st, 2021 by AnyChart Team

Nemus forestry data visualization system created by Cesefor in cooperation with Regional Government of Castile and LeonMany thousands of developers worldwide use our solutions for interactive data visualization. So it is hardly surprising to come across a graphic powered by AnyChart here or there. Some projects, however, deserve a showcase. Such a new interesting one demonstrating great use of AnyChart has recently come to our notice and we are happy to let you know about it.

A Spanish nonprofit, Cesefor used our JavaScript charting library to visualize forestry data for the Spanish region of Castile and León in a whole lot of different charts and maps, aiming to make relevant insights easily accessible and actionable for sustainability.

The project is called Nemus. Shh, it is still in beta, not yet officially launched. But Rodrigo Gómez Conejo, Head of ICT and Knowledge Management Area at Cesefor, allowed us to let you in and even gave us a brief interview disclosing some peculiar details about the system and how AnyChart is employed — check it out below. (Stack: jQuery/CodeIgniter/PostgreSQL.)

Read more »