Archive for the JavaScript

HR Dashboard – Built With AnyChart JavaScript (HTML5) Charts Library

September 1st, 2016 by AnyChart Team

An HR dashboard is a powerful BI solution that can mightily facilitate making right, data-driven decisions about the workforce in your company – from recruiting and training courses to compensations and job promotions. Smart visualization of all relevant staff-related data, with all charts and graphs on a single page, allows your Human Resources Department to see various metrics at-a-glance. As a result, HR managers are given the power to easily identify trends, outliers, and relationships when it comes to reports and data analysis, and to make sure each decision is well-timed and will drive even more success for your enterprise.

After all, it is the employees that are the most valuable asset.

To inspire and show you how easy it gets to implement this approach with the help of AnyChart JS Charts library, we added an interactive JavaScript-based Human Resources Dashboard to the Business Solutions section of our website as a new HTML5 business dashboard sample with the full source code. It nicely visualizes various employee related data, including demographics, payrolls, performance measurements, and so on. Of course, you are welcome to fork this sample and use our HR Dashboard fully or partially to create your own solution.

Interactive HR Dashboard business solution for human resources analysis and management. Created with AnyChart JavaScript (HTML5) Charts library

Now let’s have a closer look at this interactive HTML5 dashboard, including its composition and some peculiar features. Read more »

JS Linear Gauge by AnyChart and More

August 15th, 2016 by Margaret Skomorokh

Radio Scale – JS Linear Gauge by AnyChart

Radio Scale – JS Linear Gauge by AnyChart


Here are the the data visualizations (and related information) that we have posted this week on AnyChart Facebook Page and in Twitter, including a JS Linear Gauge by AnyChart:

  • The Real Value of $100 in Each State – Everything is relative. This map by Tax Foundation shows the real value of $100 in each state in the U.S. Prices for the same goods are often much cheaper in states like Missouri or Ohio than they are in states like New York or California. As a result, the same amount of cash can buy you comparatively more in a low-price state than in a high-price state. (The visualization is based on the data published by The Bureau of Economic Analysis.)
  • Sugar Consumption by Mona Chalabi – This chart showing sugar consumption from 1700 to 2000 is only one of many wonderful handmade “data sketches” in Mona Chalabi’s Instagram. Visit it to learn about crying frequency per week, handwriting vs. typing speed, median cost of a funeral, and other facts, visualized in drawings.
  • Guide to Figuring out the Age of an Undated World Map – With this visual guide from xkcd.com, you will always be able to figure out the age of an undated world map.
  • Radio Scale – JS Linear Gauge by AnyChart – A linear gauge (added in AnyChart 7.11.0) is visual representation of a measuring device with a horizontal or vertical scale and a pointer or multiple pointers indicating particular values. The scale is usually color zoned, which helps to see what range the value of interest falls in. Linear gauges can represent thermometers, battery indicators, rulers, and any other devices with straight line–shaped scales. For example, this interactive gauge from our gallery represents a radio scale. To learn more about linear gauges in AnyChart, see the following article:

HTML5 PERT Chart by AnyGantt and More

August 5th, 2016 by Margaret Skomorokh
House Construction – HTML5 PERT Chart by AnyGantt

House Construction – HTML5 PERT Chart by AnyGantt

Here is a quick recap of the visualizations that we have shared with you this week on AnyChart Facebook Page and in Twitter (including an HTML5 PERT Chart by AnyGantt):

  • Where Europe is most and least innovative, in 6 maps (a data visualization by The Washington Post) – The continent’s most creative and productive regions are in Germany, France, Britain and the Nordic countries. Southern England, northern Denmark, southern Germany and Paris are particularly successful — whereas Romania, Poland and Spain have disproportionately more regions that lack innovation.
  • Pokémon dual-type charts – looks like playing Pokémon Go is not that easy!
  • Global Sharknado Threat Map – Created by an unprecedentedly cross-discipline team of nameless chain-smoking scientists in white lab coats, this map is intended as a resource to coastal communities regarding the nature and likelihood of a sharknado incursion. Right?X
  • House Construction (HTML5 PERT Chart by AnyGantt). In AnyGantt 7.11.0, we have added a new decision-making tool – PERT Charts. PERT is an abbreviation for “Program (Project) Evaluation and Review Technique”. This technique, developed by the U.S. Navy in the 1950s, is used in project management to analyze and represent the tasks involved in completing a given project. It is applied mostly in large-scale projects where time is the major factor and allows to schedule a project without knowing precisely the details and durations of all activities. For example, PERT was used in planning the 1968 Winter Olympics in Grenoble. You can see more samples of AnyGantt PERT charts in our PERT Chart Gallery.

AnyChart 7.11.0 with JS Stock Drawing Instruments Released

July 27th, 2016 by Timothy Loginov

Good news! We have released AnyChart, AnyStock, AnyMap, and AnyGantt 7.11.0. In the new versions of our products, you will find such long-awaited features as JS Stock Drawing Instruments, Pert Charts, Linear Gauges, Seat Maps, and more. Here is the full list of improvements:

AnyStock

JS Stock Overlay Drawing Instruments
JS Stock Overlay Drawing Instruments

Stock Overlay Drawing Instruments are a complete set of drawing tools that allow end users to add drawings to charts. It includes such tools as Line segment, Ray, Trend Line, Vertical Line, Horizontal Line, Rectangle, Ellipse, Triangle, Trend channel, Andrew’s pitchfork, Fibonacci fan, Fibonacci arc, Fibonacci retracement, Fibonacci Time Zones, Buy/Sell Signals, and more – all of them being fully configurable and easily manageable.

Take a look at Stock Overlay Drawing Instruments Demo >>
Take a look at Stock Overlay Drawing Instruments in the Gallery >>
Learn more about Stock Overlay Drawing Instruments >>
AnyStock Y-Scale Mode: Changes/PercentChanges
Y-Scale Mode: Changes/PercentChanges

AnyStock now supports the Y-Scale “Comparison Mode”, which allows comparing changes in series values. Changes can be shown in two modes: value and percent, and a custom date can be set as the comparison base.

Take a look at Y-Scale Mode in the Gallery >>
Learn more about Y-Scale Mode >>

AnyChart

Full Accessibility Support (Section 508) in AnyChart
Full Accessibility Support (Section 508)

All AnyChart charts now support AAA-level web accessibility standards (Section 508) using very flexible a11y (accessibility) features. AnyChart supports two accessibility modes:

Learn more about Accessibility Support >>
AnyChart Linear/Tank/Thermometer Gauges
Linear Gauge

We have created a very flexible way of building any type of Linear Gauges. You can use built-in constructors for LED, Tank, and Thermometer Gauges or build your own Gauge with simple configurations.

Take a look at Linear Gauges in the Gallery >>
Learn more about Linear Gauges >>
AnyChart Chart Editor
Chart Editor

The Chart Editor feature, which makes the integration of AnyChart much easier, is a dialog window that allows to create and set up various chart types. The result can be saved with fixed data in XML or JSON format or in a reusable format with a JavaScript code string.

Take a look at Chart Editor Demo >>
Learn more about Chart Editor >>
Async Rendering in AnyChart
Async Rendering

The Async Rendering feature allows you to make web pages and applications with a big number of charts more responsive during the page loading process.

Learn more about the Async Rendering feature >>

AnyMap

AnyMap Seat Map
Seat Map

Seat Maps simplify the process of building interactive Airplane Seating Charts, Opera and Cinema Plans, or any other types of seat maps. It is suitable for building interactive schemes of parks, malls, or virtually any other entities.

Take a look at Seat Maps in the Gallery >>
Learn more about Seat Maps >>
AnyMap Label Positioning Improvements in AnyMap
Map Label Positioning Improvements

We have added a lot of features to improve visual appearance of geographical maps. Now it is possible to place region labels outside of regions bounds, using Latitude/Longitude data. The Label Overlap Control feature helps to keep a big amount of labels under control. Small regions can be highlighted using the Callout feature.

Learn more about Map Label Positioning Improvements >>
TopoJSON Format Support in AnyMap
TopoJSON Format Support

AnyMap now supports loading geodata in TopoJSON format. Geographical data files in TopoJSON format are much smaller, using them allows to reduce map rendering and page loading time.

Take a look at a sample of using TopoJSON format as geodata >>
Read more about TopoJSON Format Support >>
Ability to Use SVG Images as Geodata in AnyMap
Ability to Use SVG Images as Geodata

AnyMap now supports loading Geo Data in SVG format. This format may be quite useful if you want to edit a map in a simple vector editor or to create a map of an imaginary place, a road map, or a map with rivers or custom labels.

Take a look at a sample of using SVG format as geodata >>
Read more about the Ability to Use SVG Images as Geo Data >>

AnyGantt

AnyChart PERT Chart
PERT Chart

A PERT Chart (Program evaluation and review technique) is a great decision-making tool designed to save time in achieving end-objectives. AnyGantt provides flexible settings of milestones (events), tasks (activities) and critical path.

Take a look at PERT Charts in the Gallery >>
Learn more about PERT Charts >>

AnyChart version history: https://www.anychart.com/products/anychart/history/
AnyStock version history: https://www.anychart.com/products/anystock/history/
AnyMap version history: https://www.anychart.com/products/anymap/history/
AnyGantt version history: https://www.anychart.com/products/anygantt/history/

Trial download of our JS framework: https://www.anychart.com/download/

JavaScript Stock Chart by AnyChart and More

July 22nd, 2016 by Margaret Skomorokh

JavaScript Stock Chart with SMA by AnyChart

JavaScript Stock Chart with SMA by AnyChart

In this post, you will find a recap of the data visualizations that we have shared with you this week on AnyChart Facebook Page and in Twitter. One of them is a JavaScript Stock Chart by AnyChart:

JavaScript Funnel Chart by AnyChart and More

July 16th, 2016 by Margaret Skomorokh

Brand Engagement – JavaScript Funnel Chart by AnyChart

Brand Engagement – JavaScript Funnel Chart by AnyChart

This week we have shared with you on AnyChart Facebook Page and in Twitter a few cool data visualizations, including a JavaScript Funnel Chart by AnyChart. Here is a quick recap:

  • Is Sushi ‘Healthy’? What About Granola? Where Americans and Nutritionists Disagree
    (an infographic by The Upshot) – Is popcorn good for you? What about pizza, orange juice or sushi? Or frozen yogurt, pork chops or quinoa? Which foods are healthy? In principle, it’s a simple enough question, and a person who wishes to eat more healthily should reasonably expect to know which foods to choose at the supermarket and which to avoid. Unfortunately, the answer is anything but simple.
  • Game of Thrones: the most Googled characters – This visualization by The Guardian shows the most googled characters from Game of Thrones, episode by episode. See and find out which events in the show had the biggest effect on search traffic. (Spoiler alert: It reveals significant plot points of seasons one through to five.)
  • FiveThirtyEight 2016 Election Forecast – Hillary Clinton vs. Donald Trump: who will win the 2016 presidential elections? Here is a forecast by Nate Silver (FiveThirtyEight), showing how the 538 Electoral College votes could break down in the presidential election – it is explained in 7 data visualizations. The forecast will be continually updated through Election Day on Nov. 8.
  • Brand Engagement (JavaScript Funnel Chart by AnyChart) – On this interactive Funnel Chart, you can see a visualization of a Nation Wide survey on a Brand recognition. Funnel Charts are mostly used to represent stages in a sales process and show the amount of potential revenue for each stage. They can also be useful in identifying potential problem areas in an organization’s sales processes. A Funnel Chart is similar to a Stacked Percent Column Chart.

AnyChart JS Stacked Area Chart and More

July 9th, 2016 by Margaret Skomorokh

AnyChart JS Stacked Area Chart

AnyChart JS Stacked Area Chart

Here is a quick recap of the visualizations (and related information) that we have shared with you this week on AnyChart Facebook Page and in Twitter (including a JS Stacked Area chart by AnyChart):

  • Six Infographics for Independence Day – The Declaration of Independence, signed on July 4th, 1776, is both a symbol of American liberty and an enduring monument to the philosophy of America’s forefathers. But Today, Independence Day is more than a celebration of this important moment in history. It’s also an opportunity for robust American fun: fireworks, hot dogs, excessive drinking, and lounging about in the summer sun. Here are 6 infographics that explore the history, patriotism, pyrotechnics, and personal excesses of one of America’s favorite holidays.
  • Dontclick.it – What changes for the user and the interface once you can’t rely on the habit of clicking? Check out Dontclick.it, an experimental clickfree interface, and see is clicking is irresistible for you!
  • 10 Cities Americans Are Moving To Right Now – Whether for professional or personal reasons, people sometimes pick up and move. In the United States, folks have been migrating to urban areas in recent generations, but these days the places they wind up are not necessarily the major hubs we might expect. Real estate information platform, Realtor.com, combined its internal data with U.S. Census Bureau information and discovered where Americans are moving these days. The results might surprise you.
  • AnyChart JS Stacked Area Chart – This interactive 100% Stacked Area chart was created with our charting component. Stacked Area charts are multi-series Area charts that display the trend each value contributes over time or categories. They are good at emphasizing the magnitude of changes over time, as well as at drawing attention to the total value across a trend. In a 100% Stacked chart, values are not displayed, and only the percentage each value contributes is shown, so that users can easily compare them.

AnyChart HTML5 Radar Chart and More

July 2nd, 2016 by Margaret Skomorokh

AnyChart HTML5 Radar Chart

AnyChart HTML5 Radar Chart

This week we have posted on AnyChart Facebook Page and in Twitter some beautiful data visualizations and related information; we have also shared AnyChart HTML5 Radar Chart. If you have missed the posts, you can read this recap:

  • EU referendum: full results and analysis (by The Guardian) – Britain has voted by a substantial margin to leave the European Union. The picture that is emerging is of a heavily polarised country, with remain areas coming in more strongly for remain than expected, and leave areas more strongly for leave. Scotland and London have voted overwhelmingly for remain, but outside the capital, every English region had a majority for leave.
  • What happens in an anxious brain? How do we learn? How to stop being afraid of dogs? Neuroscience answers all these questions. Neurotic Neurons is nice interactive animation about neurons and anxiety (a part of the Explorable Explanations project). It explains the concept of exposure therapy, which is used in Cognitive Behavioral Therapy.
  • Who needs genres when there is data? Decibels & Decimals is a collection of beautiful data visualizations and thoughts about the modern music environment. This project by Brady Fowler, a graduate of Georgetown University, aims to bring data-driven thinking to extract trends in music sharing, creation, performance and reception.
  • Du Hast – Rammstein’s Du Hast: a programmer’s version (misheard lyrics).

  • AnyChart HTML5 Radar Chart – This interactive chart compares 3 countries by 8 criteria, helping to see each country’s strong points. It is an example of how you can use a Radar chart (also known as web chart, spider chart, star chart, cobweb chart, star plot, irregular polygon, or kiviat diagram) – a graphical method of displaying multivariate data in the form of a two-dimensional chart of three or more quantitative variables represented on axes starting from the same point.

JS Candlestick Chart by AnyStock and More

June 28th, 2016 by Margaret Skomorokh

JS Candlestick Chart by AnyStock

JS Candlestick Chart by AnyStock

Last week we have shared with you on AnyChart Facebook Page and in Twitter the following data visualizations (including a JS Candlestick chart by AnyStock):

  • Explore the world with Tim Peake – Use this map to explore ESA astronaut Tim Peake’s stunning photos of Earth, taken from the International Space Station during his six month mission (created by Esri UK). You will find photos of London, Ethiopia, New Orleans, and many other places, all of them looking great from space!
  • ThermalPlot – Multi-attribute time-series data plays a vital role in many different domains. An important task when making sense of such data is to provide users with an overview to identify items that show an interesting development over time. However, this is not well supported by existing visualization techniques. ThermalPlot is a technique allowing to visualize multi-attribute time-series data using a thermal metaphor, which helps users to find items that are important (Team: Johannes Kepler Universität, St. Pölten University of Applied Sciences).
  • Understanding Millenial Moviegoers – This infographic by the theatrical analytics company Movio reveals the truth about millennial moviegoing. There are some bad news for art-house and indie filmmakers hoping to get young people into the theater: according to these data, the younger millennials are 45% less inclined to see a drama and 52% less interested in an indie film.
  • JS Candlestick Chart by AnyStock – A Japanese Candlestick chart is a combination of a line chart and a bar chart used primarily to describe price movements of an equity over time, where each bar represents the range of price movement over a given time interval. It is mostly used in technical analysis of equity and currency price patterns. The interactive Candlestick chart you see here was created using AnyStock – a JavaScript-based financial charting solution by AnyChart.

Documentation for AnyChart Web Charts: Now Offline

June 17th, 2016 by Margaret Skomorokh
Documentation for AnyChart Web Charts (Sample)

Good news: now you can download documentation for AnyChart web charts and work with it offline, which is a useful option for anyone with a slow Internet connection. To do it, you should go to https://docs.anychart.com, choose AnyChart version in the upper menu, and press the “Download.zip” button to the right of it. You will get the documentation describing the version of your choice.

AnyChart has a great documentation: for the current version (7.10.1), there are more than 140 articles and almost 900 samples, explaining every aspect of our product and demonstrating how to work with it. You can run all the samples both in JSFiddle and in our PlayGround. Also, you can find an even more detailed description of our charting library in AnyChart API. For more samples, see AnyChart Gallery.

Categories
Archive