Archive for the HTML5

How to Create Candlestick Chart with JavaScript for Stock Analysis

May 2nd, 2023 by Awan Shrestha

Candlestick Chart Built with JavaScript for Stock AnalysisCandlestick charts are a fantastic data visualization tool for tracking the price movements of stocks over a period of time. In this tutorial, I'll show you how to create your own candlestick chart using JavaScript.

We’ll be using TSMC (Taiwan Semiconductor Manufacturing Company) as an example, as they're the largest contract chip maker in the world and have been making waves in the stock market recently.

By the end of this tutorial, you'll be able to create your own JS candlestick charts and analyze stock trends like a pro. So, let's get started and dive into the exciting world of data visualization with JavaScript!

Read the JS charting tutorial »


Nick Mar Uses AnyChart JS Charts to Visualize User Performance and Stock Market Data

April 24th, 2023 by AnyChart Team

Nick Mar's charts powered by AnyChart JS ChartsAs the world’s top provider of cutting-edge data visualization solutions, we are constantly thrilled to witness how our products are utilized by both businesses and individuals to create interactive charts and dashboards. We recently had the opportunity to chat with software developer Nick Mar, who shared some of his personal projects with us, highlighting the use of AnyChart and his experience with our JavaScript charting library. Check out our interview with him! (Stack: HTML/CSS/JavaScript.)

Read more »


Building 3D Surface Plot in JavaScript

April 11th, 2023 by Awan Shrestha

3D Surface Plot in JavaScriptWelcome to this tutorial on creating a visually stunning and interactive 3D surface plot using JavaScript! If you’re passionate about data visualization and want to expand your skills to the next level, this guide is for you. Here, we’ll take you through a step-by-step process to create an engaging 3D surface plot that will make your data come alive.

Sometimes, representing complex information using traditional 2D charts can be difficult, especially when working with large datasets or data that varies over three or more dimensions. This is where a 3D surface plot (or surface chart) can prove to be useful. In this tutorial, we’ll be using real-world population data to create our surface plot, showcasing the population growth trends of the top 50 most populous countries in the world. You don’t need to be a data expert to follow this guide, as we’ll cover everything in detail.

So, sit back, grab your favorite beverage, and let’s dive into the world of data visualization with a 3D surface plot. By the end of this tutorial, you’ll have an impressive chart that you can showcase to your colleagues or friends. Let’s get started!

Read the JS charting tutorial »


Creating Interactive Flow Maps with JavaScript

March 22nd, 2023 by Awan Shrestha

A laptop with an Interactive Flow Map built with JavaScriptFlow maps are a powerful way to represent the movement of objects between different geographic locations, and with JavaScript, creating an interactive flow map is easier than you might think. Flow maps combine the functionality of a map and a flow diagram; this type of visualization shows the direction of movement of people, goods, money, or information, as well as the quantity of those.

In this step-by-step tutorial, we’ll guide you through the process of creating a JavaScript flow map. To make it more practical, we’ll use the example of visualizing the number of students from India studying abroad in different countries. By following the tutorial, you’ll learn how to create your own flow maps using JavaScript, regardless of the data you choose to use.

So, let’s get started! Follow along with us to learn how to develop your own JS Flow Map.

Read the JS charting tutorial »


How to Create Box-and-Whisker Plot in JavaScript

March 16th, 2023 by Awan Shrestha

Box-and-Whisker Plot in JavaScript on Laptop ScreenTransform your data into insights with a stunning box-and-whisker plot! Learn what it is and how to create one with ease using JavaScript. In this tutorial, I’ll walk you through the steps to make a neat and visually appealing JS-based (HTML5) box chart with the yearly gross salaries of different IT professions in Europe. Unlock the power of data visualization and start quickly identifying trends and patterns today!

Read the JS charting tutorial »


Italian Gruppo Astrofili Galileo Galilei Uses AnyChart JS Charts for Astronomical Data Visualization

March 9th, 2023 by AnyChart Team

Logo of Italian Gruppo Astrofili Galileo Galilei That Uses AnyChart JS Charts for Astronomical Data VisualizationWe are glad to continue supporting non-profit initiatives all over the world by allowing them to use our JavaScript charting library free of charge. Recently, Giorgio Mazzacurati of Gruppo Astrofili Galileo Galilei, an Italian association of amateur astronomers, told us about how AnyChart helps with their visual data analysis. He also shared a few snapshots showing our interactive JS charts in action. Take a look! (Stack: Python/Flask/MySQL.)

Read more »


How to Build Venn Diagram Using JavaScript

March 2nd, 2023 by Shachee Swadia

Venn Diagram for Web Using JavaScriptHumans are visual beings, and charts are widely used to boost the UX when it comes to showing a lot of information. Take Venn diagrams, for example, which are great at displaying commonalities and differences between several sets of items. And it’s possible to create a nice interactive one for a web page or app without much hassle.

Scrolling through Twitter before Christmas, I came across a cool Venn diagram comparing Santa Claus, Sauron, Gandolf, and Tom Bombadil. For fun, I reproduced it using JavaScript. That appeared to be easy enough to give me an idea of a tutorial on how to quickly build JS-based Venn diagrams, which I hoped could be helpful to both designers and developers.

So, here I am with the article! The original graphic by Tea with Tolkien that inspired me is used as an illustrative example — let’s build this Venn diagram in JavaScript step by step right now!

Read the JS charting tutorial »


CEO Anton Baranchuk Receives 2023 DEVIES Award for AnyChart

February 16th, 2023 by AnyChart Team

CEO Anton Baranchuk Receives Devies Award on Behalf of AnychartLast night was amazing: Anton Baranchuk, CEO and Co-founder of AnyChart, received our award for Best in Data Analytics and Visualization at DeveloperWeek’s DEVIES Awards ceremony in Oakland, California!

Check out some photos from the event in this quick story!

Read more »


AnyChart Named Best in Data Analytics & Visualization 🏆

February 3rd, 2023 by AnyChart Team

Best in Data Analytics & Visualization: AnyChartWe’re proud to announce that AnyChart has won a prestigious 2023 DEVIES Award in the Data Analytics & Visualization category! Many thanks to the jury and congratulations to all our partners and customers!

Celebrating 20 years in the market this year, we at AnyChart have been working hard to develop the best-in-class data visualization solutions. And we will keep innovating and excelling!

The DEVIES Awards are the definitive annual awards for the software industry, recognizing outstanding design, engineering, and innovation in developer technology across multiple categories. This year’s winners were selected from record-high hundreds of nominations by an expert-led panel of the DevNetwork Advisory Board, including representatives of Accenture, DigitalOcean, EA, Google, IBM, Salesforce, and other great companies.

Read more »


Visualizing Text Data Hierarchy with Word Trees

January 19th, 2023 by Julien Blanchard, Meta

Visualizing Text Data Hierarchy with Word TreesOver the past few weeks, I have been looking for a quick and effective way of representing the structural differences within a set of similar-looking short sentences.

To provide a bit of context, as we approached the end of 2022, my workmates and I got heavily involved in a planning phase for the new year to start. More specifically, we were asked to write a set of objectives and key results that would help drive a common strategy across our supported programs and pillars over the months to come.

And as expected, each and every one of us ended up leaving comments for every subtle change made to the couple of sentences that had initially been dropped into a shared document. As the comments started piling up, it quickly became quite tedious to follow and understand the slight modifications that were being made to our original set of objectives and key results.

As I started exploring what we could have done to better capture and visualise these changes, I recently found a way to display text data in a hierarchical way that I thought would be worth sharing.

Read the JS charting tutorial »