appsignal

We've Redesigned Our Charts at AppSignal: 6 New Features

Wes Oudshoorn

Wes Oudshoorn on

We've Redesigned Our Charts at AppSignal: 6 New Features

AppSignal is excited to announce that we've given our charts a major makeover, making them more powerful and user-friendly.

We've rebuilt our charts from the ground up.

Why We Rebuilt the Charts

Our original charts were built many years ago using D3 and React. We were one of the first to do this, and they worked surprisingly well for many years. However, they weren't as composable as we needed them to be, and adding new features wasn't easy. So, we decided to rebuild them from the ground up to improve technical performance, developer experience, and, most importantly, user experience.

We attempted to use a few different libraries, but instead of them working for us, we found ourselves fighting against the libraries. Our user experience and performance needs were simply too specific to adopt an off-the-shelf solution.

Our new charts are packed with the most requested features from our users. Here are six new features and why we think developers will love them.

1. Zoom Into Charts

Enhance. And enhance some more. Our new zoom feature allows you to zoom into specific sections of your charts. Simply click and drag to zoom in on sections with many close data points. This feature is perfect for analyzing critical data points more closely.

2. Choose Your Color Scheme

We've updated our default color scheme to be more user-friendly and match our brand system. If you don't like the default colors, you can choose from a variety of schemes, which is especially nice for users with color vision deficiency.

3. Start Y-Axis At 0

You now have the option to start your Y-axis at 0. This is useful when your data fluctuates between values of 90—95, but you want your chart to always show 0—100.

Y-axis at 0

4. Gridlines

Add X and Y gridlines to your charts for a clearer view and better data readability. You can toggle these easily from the new chart settings dropdown.

5. Adjustable Line Thickness

You can now select line thickness (1px, 1.5px, 2px) to change the thickness of lines in your charts, making it much easier to differentiate between lines with slightly similar colors.

6. Sortable Hovering Legend

Sort the legend alphabetically or numerically, ascending or descending. Now, you can easily keep the legend in the same order by name or always have the highest/lowest value on top when hovering over the full chart.

New Charts Available Now

The new charts are available to all users (yes, that means you, too) immediately.

Once you've logged in, you'll find a new dropdown at the top right where you can set your personal preferences for color schemes, gridlines, and line thickness.

What's Next?

We're not stopping here! In terms of adding more chart functionality, we are considering:

  • A fullscreen version of charts for easier reading of larger datasets.
  • More data retention options, giving users access to minutely metrics for a longer timeframe.
  • Comparing chart timeframes so you can compare two timeframes against each other.

We might be biased, but we believe we now have the most beautiful, fast, and easy-to-use charts in the monitoring market. Try them out today with a free trial of AppSignal and see for yourself, and please keep the feedback coming. We're listening, and we're building.

Happy charting!

Wes Oudshoorn

Wes Oudshoorn

Once a rogue designer, now co-founder and manager of colors at AppSignal. If our app looks great, it's to his credit. If something is wrong, he points at developers. Loves skiing.

All articles by Wes Oudshoorn

Become our next author!

Find out more

AppSignal monitors your apps

AppSignal provides insights for Ruby, Rails, Elixir, Phoenix, Node.js, Express and many other frameworks and libraries. We are located in beautiful Amsterdam. We love stroopwafels. If you do too, let us know. We might send you some!

Discover AppSignal
AppSignal monitors your apps