- Post History
- Subscribe to RSS Feed
- Mark as New
- Mark as Read
- Bookmark
- Subscribe
- Printer Friendly Page
- Report Inappropriate Content
4 hours ago
We are all used to the standard reporting widgets in ServiceNow. They are functional, reliable, and exactly what we expect. But sometimes, you just want to see your data move.
Demo Video:
I built this Bar Chart Race widget as a fun side project to break away from the usual static dashboards. I wanted to bring that viral data visualization style—where you watch rankings change over time—directly into the Service Portal. It turns out, watching your assignment groups or incident trends "race" against each other is a lot more engaging than staring at a list view
Why I Built It
The goal wasn't to replace standard reporting, but to enhance the visual experience of the portal. I wanted to create something that looked and felt different from the standard reports we see every day.
I focused heavily on the aesthetic for this one. Instead of the standard flat white background, I implemented a "Glassmorphism" design—that translucent, frosted-glass look you see in(well, you know where).
With a simple toggle, the widget switches between a clean Light Mode (Aurora) and a high-contrast Dark Mode (Midnight). It’s a small detail, but it makes the data pop and fits much better into modern, dark-themed components.
An additional toggle is provided to refresh the chart to run the animation again because why not!
Under the Hood
Technically, this connects ServiceNow’s historical data with the D3.js library. I kept the architecture simple:
- Zero Configuration: It lazy-loads the necessary libraries automatically, so you don't need to mess with Dependency records.
- Responsive: It uses DOM detection to resize the chart perfectly, whether it's on a full-width dashboard or a narrow sidebar column.
- Scoped or Global: It works wherever you need it.
Try It Out
This was a fun build for me, and I’m sharing it with the community so you can use it too. It is fully open-source and free for personal or commercial use.
You can download the Update Set from ServiceNow Share and share your feedback.
Happy Learning!
