Technology

Using Angular to render DOM with D3 generators

D3 was an obvious choice for building data visualizations in the HyperTrack dashboard because of the ability to customize to our hearts content. However, we wanted to use the Angular framework to handle DOM rendering. Continue reading

Standard
Tutorial

Why we created heatmap views for our customers

Our customers use HyperTrack to track live location of their app users, often in the context of actions they perform in the app. For example, how far has my delivery reached, did my service professional reach the customer on time, how far is my friend from the restaurant where we are meeting up, where is the place I am supposed to meet the merchant, and so on.

As HyperTrack started generating location data for thousands of users, customers started asking more aggregate questions. Can you show me the live location of my users on a map right now? Can you show me the places where my users have been this month? Can you show me the clusters where my customers are located? Can you show me the places where my users stop and spend most time?

Now, the answer to all of these questions is yes.

Continue reading

Standard
Technology

Trip Replay Using Leaflet.js and Mapbox

Replaying an action is one of the more popular use cases HyperTrack developers have. It unlocks a new dimension (literally) of visibility that static polylines and markers fail to provide. Continue reading

Standard
Technology

Redux in Angular

As we reviewed dashboard V2 while working on V3, state management showed up as the biggest issue. For example on our live page we show the last know location of all the drivers. This UI state would need to refresh based on multiple actions – selecting a fleet, selecting status tabs, selecting a driver or explicitly hitting the refresh button at the bottom of the map. Because the state could be altered by so many events, it became difficult to handle race conditions and edge cases to provide a consistent view. Continue reading

Standard
Technology

Rendering realtime list using Angular2

We have built HyperTrack’s dashboard ground up using angular2. Oh and we released a brand spanking new version yesterday that you should check out if you haven’t already. Our dashboard provides realtime visualization of geospatial data for business users. One of the more popular views is the task page that lets you track all live tasks being performed by the workforce. Continue reading

Standard
General

Building our new Dashboard using Angular 2

Angular 2 is here. The Angular team had stormed the Angular developer community by announcing that its new version will be a complete rewrite with no backward compatibility. AngularJs was originally built for designers for rapid prototyping, performance had never been its strength. Angular 2 was being written to build large enterprise-grade apps. Continue reading

Standard
Announcement

How we designed the HyperTrack dashboard

(I am making this post on behalf of an awesome designer who chooses to remain anonymous. This person has designed multiple industry leading products used by tens of millions of users. I have the privilege of taking this design to production for our customers. Hope you like it!)

When we started designing Hypertrack, we got together with some of our key customers to understand what they needed to see. How can we give them a dashboard which is smart? How can we give them the information they need to see without them having to ask? We got them to sketch solutions to ensure we were building the right feature set. Continue reading

Standard