Visualize Time Series Data with μPlot Library

📈 μPlot

A small (< 30 KB min), fast chart for time series, lines, areas, ohlc & bars (MIT Licensed)


μPlot is a fast, memory-efficient Canvas 2D-based chart for plotting time series, lines, areas, ohlc & bars; from a cold start it can create an interactive chart containing 150,000 data points in 135ms, scaling linearly at ~25,000 pts/ms. In addition to fast initial render, the zooming and cursor performance is by far the best of any similar charting lib; at < 30 KB, it’s likely the smallest and fastest time series plotter that doesn’t make use of context-limited WebGL shaders or WASM, both of which have much higher startup cost and code size.

166,650 point bench:

However, if you’re looking for true real-time 60fps performance with massive datasets, uPlot can only get you so far. WebGL should still be the tool of choice for applications like realtime signal or waveform visualizations: Try danchitnis/webgl-plot, huww98/TimeChart, epezent/implot.

uPlot Chart



In order to stay lean, fast and focused the following features will not be added:

  • No data parsing, aggregation, summation or statistical processing - just do it in advance. e.g.,
  • No transitions or animations - they’re always pure distractions.
  • No collision avoidance for axis tick labels, so may require manual tweaking of spacing metrics if label customization signficiantly increases default label widths.
  • No stacked series or line smoothing. See links for how these are each terrible at actually communicating information. While neither will be part of the core, uPlot’s API makes it easy to implement both: stacked-series, line-smoothing.
  • No built-in drag scrolling/panning due to ambiguous native zoom/selection behavior. However, this can be added externally via the plugin/hooks API: zoom-wheel, zoom-touch.

Documentation (WIP)

The docs are a perpetual work in progress, it seems. Start with /docs/ for a conceptual overview. The full API is further documented via comments in /dist/uPlot.d.ts. Additionally, an ever-expanding collection of runnable /demos covers the vast majority of uPlot’s API.


Benchmarks done on a ThinkPad T480S:

  • Date: 2020-09-18
  • Windows 10 x64, Chrome 85.0.4183.102 (Official Build) (64-bit)
  • Core i5-8350U @ 1.70GHz, 8GB RAM
  • Intel HD 620 GPU, 2560x1440 res

uPlot Performance

Full size:

Raw data:

lib size done js,rend,paint,sys heap peak,final interact (10s)
uPlot 28 KB 65 ms 99 5 1 67 15 MB 3 MB 198 371 129 237
Chart.js-next 229 KB 235 ms 289 2 1 95 32 MB 20 MB 3604 34 46 6125
LightningChart 931 KB — ms 356 3 1 70 26 MB 20 MB 9114 65 55 272
dygraphs 125 KB 185 ms 260 4 2 171 93 MB 48 MB 2294 241 114 404
CanvasJS 479 KB 323 ms 378 5 1 93 40 MB 25 MB 2173 457 119 397
Flot 494 KB 334 ms 202 7 2 283 24 MB 19 MB
dvxcharts 369 KB 326 ms 585 34 2 62 62 MB 26 MB 1394 717 204 270
Highcharts 384 KB — ms 748 9 2 75 49 MB 21 MB 2012 725 217 317
Chart.js 245 KB 654 ms 718 4 2 164 101 MB 85 MB 5550 5 7 4020
Plotly.js 3400 KB 465 ms 828 7 1 83 50 MB 28 MB 1507 229 53 177
ECharts 785 KB — ms 718 6 7 1120 116 MB 77 MB 2016 70 25 7856
ApexCharts 460 KB — ms 2137 28 3 73 170 MB 97 MB 2030 220 28 122
ZingChart 857 KB 2535 ms 2711 7 1 66 143 MB 85 MB
amCharts 1200 KB 5825 ms 7509 47 13 78 256 MB 256 MB 6932 1288 282 512
  • size includes the lib itself plus any dependencies required to render the benchmark, e.g. Moment, jQuery, etc.
  • Flot does not make available any minified assets and all their examples use the uncompressed sources; they also use an uncompressed version of jQuery :/

TODO (all of these use SVG, so performance should be similar to Highcharts):

  • Chartist.js
  • d3-based
    • C3.js
    • dc.js
    • MetricsGraphics
    • rickshaw


Download Details:

Author: leeoniya


Source Code:


What is GEEK

Buddha Community

Visualize Time Series Data with μPlot Library
Siphiwe  Nair

Siphiwe Nair


Your Data Architecture: Simple Best Practices for Your Data Strategy

If you accumulate data on which you base your decision-making as an organization, you should probably think about your data architecture and possible best practices.

If you accumulate data on which you base your decision-making as an organization, you most probably need to think about your data architecture and consider possible best practices. Gaining a competitive edge, remaining customer-centric to the greatest extent possible, and streamlining processes to get on-the-button outcomes can all be traced back to an organization’s capacity to build a future-ready data architecture.

In what follows, we offer a short overview of the overarching capabilities of data architecture. These include user-centricity, elasticity, robustness, and the capacity to ensure the seamless flow of data at all times. Added to these are automation enablement, plus security and data governance considerations. These points from our checklist for what we perceive to be an anticipatory analytics ecosystem.

#big data #data science #big data analytics #data analysis #data architecture #data transformation #data platform #data strategy #cloud data platform #data acquisition

Sid  Schuppe

Sid Schuppe


How To Blend Data in Google Data Studio For Better Data Analysis

Using data to inform decisions is essential to product management, or anything really. And thankfully, we aren’t short of it. Any online application generates an abundance of data and it’s up to us to collect it and then make sense of it.

Google Data Studio helps us understand the meaning behind data, enabling us to build beautiful visualizations and dashboards that transform data into stories. If it wasn’t already, data literacy is as much a fundamental skill as learning to read or write. Or it certainly will be.

Nothing is more powerful than data democracy, where anyone in your organization can regularly make decisions informed with data. As part of enabling this, we need to be able to visualize data in a way that brings it to life and makes it more accessible. I’ve recently been learning how to do this and wanted to share some of the cool ways you can do this in Google Data Studio.

#google-data-studio #blending-data #dashboard #data-visualization #creating-visualizations #how-to-visualize-data #data-analysis #data-visualisation

Gerhard  Brink

Gerhard Brink


Getting Started With Data Lakes

Frameworks for Efficient Enterprise Analytics

The opportunities big data offers also come with very real challenges that many organizations are facing today. Often, it’s finding the most cost-effective, scalable way to store and process boundless volumes of data in multiple formats that come from a growing number of sources. Then organizations need the analytical capabilities and flexibility to turn this data into insights that can meet their specific business objectives.

This Refcard dives into how a data lake helps tackle these challenges at both ends — from its enhanced architecture that’s designed for efficient data ingestion, storage, and management to its advanced analytics functionality and performance flexibility. You’ll also explore key benefits and common use cases.


As technology continues to evolve with new data sources, such as IoT sensors and social media churning out large volumes of data, there has never been a better time to discuss the possibilities and challenges of managing such data for varying analytical insights. In this Refcard, we dig deep into how data lakes solve the problem of storing and processing enormous amounts of data. While doing so, we also explore the benefits of data lakes, their use cases, and how they differ from data warehouses (DWHs).

This is a preview of the Getting Started With Data Lakes Refcard. To read the entire Refcard, please download the PDF from the link above.

#big data #data analytics #data analysis #business analytics #data warehouse #data storage #data lake #data lake architecture #data lake governance #data lake management

Ray  Patel

Ray Patel


Clash of Python Data Visualization Libraries

Seaborn, Altair, and Plotly

Data visualization is a fundamental ingredient of data science. It helps us understand the data better by providing insights. We also use data visualization to deliver the results or findings.

Python, being the predominant choice of programming language in the data science ecosystem, offers a rich selection of data visualization libraries. In this article, we will do a practical comparison of 3 popular ones.

The libraries we will cover are Seaborn, Altair, and Plotly. The examples will consist of 3 fundamental data visualization types which are scatter plot, histogram, and line plot.

We will do the comparison by creating the same visualizations with all 3 libraries. We will be using the Melbourne housing dataset available on Kaggle for the examples.

#data-visualization #python #data-science #programming #clash of python data visualization libraries #libraries

Gerhard  Brink

Gerhard Brink


Introduction to Data Libraries for Small Data Science Teams

At smaller companies access to and control of data is one of the biggest challenges faced by data analysts and data scientists. The same is true at larger companies when an analytics team is forced to navigate bureaucracy, cybersecurity and over-taxed IT, rather than benefit from a team of data engineers dedicated to collecting and making good data available.

Creative, persistent analysts find ways to get access to at least some of this data. Through a combination of daily processes to save email attachments, run database queries, and copy and paste from internal web pages one might build up a mighty collection of data sets on a personal computer or in a team shared drive or even a database.

But this solution does not scale well, and is rarely documented and understood by others who could take it over if a particular analyst moves on to a different role or company. In addition, it is a nightmare to maintain. One may spend a significant part of each day executing these processes and troubleshooting failures; there may be little time to actually use this data!

I lived this for years at different companies. We found ways to be effective but data management took up way too much of our time and energy. Often, we did not have the data we needed to answer a question. I continued to learn from the ingenuity of others and my own trial and error, which led me to the theoretical framework that I will present in this blog series: building a self-managed data library.

A data library is _not _a data warehousedata lake, or any other formal BI architecture. It does not require any particular technology or skill set (coding will not be required but it will greatly increase the speed at which you can build and the degree of automation possible). So what is a data library and how can a small data analytics team use it to overcome the challenges I’ve described?

#big data #cloud & devops #data libraries #small data science teams #introduction to data libraries for small data science teams #data science