[EAGLE-868] Refactor metric chart render process to improve user experience.

• Type: Sub-task
• Status: Closed
• Priority: Minor
• Resolution: Fixed
• Fix Version/s: v0.5.0
• Component/s: App::Hadoop JMX Monitor, Core::UI Engine
• Assignee: JiJun Tang
• Reporter: Hao Chen
• Created: 16/Jan/17 06:01
• Updated: 14/Feb/17 08:08
• Resolved: 14/Feb/17 06:10

Description

Problem

Currently when initially loading hbase metric page, there will be relatively long time that the whole metric dashboard is blank, then all charts and data are rendered at same time.

Improvements

• Refactor the metric load logic to : Load metric chart config -> show metric chart placeholder (show blank chart with no data) and show "data loading icon" for each chart one by one -> load metric data query for each chart -> reader metric data into metric chart when response returned and remove "data loading icon" one by one.
• Add "loading-in-progress icon" with appropriate description during any long-time actions.

Issue Links

• links to: GitHub Pull Request #792