You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@skywalking.apache.org by wu...@apache.org on 2020/01/13 08:54:03 UTC

[skywalking-rocketbot-ui] branch master updated: Feat: merge P50-99 into percentile metric (#245)

This is an automated email from the ASF dual-hosted git repository.

wusheng pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/skywalking-rocketbot-ui.git


The following commit(s) were added to refs/heads/master by this push:
     new 90984a7  Feat: merge P50-99 into percentile metric (#245)
90984a7 is described below

commit 90984a70d602094eedcd027318df6e27639c8f9a
Author: Qiuxia Fan <fi...@outlook.com>
AuthorDate: Mon Jan 13 16:53:53 2020 +0800

    Feat: merge P50-99 into percentile metric (#245)
    
    * feat: update global percentile
    
    * feat: update service percentile
    
    * feat: update percentile
    
    * feat: add percentile for comparsion
    
    * feat: update percentile for topo
    
    * feat: update percentile
    
    * fix: add id
    
    * fix: remove pxx
    
    * fix: update
    
    * fix: rm dead code
    
    Co-authored-by: 吴晟 Wu Sheng <wu...@foxmail.com>
---
 src/graph/fragments/comparison.ts                 |  94 ++----------
 src/graph/fragments/topology.ts                   | 168 ++--------------------
 src/store/modules/comparison/comparison-const.ts  |   1 +
 src/store/modules/comparison/comparison-store.ts  |  31 ++--
 src/store/modules/dashboard/fragments/database.ts |  64 +--------
 src/store/modules/dashboard/fragments/endpoint.ts |  24 +---
 src/store/modules/dashboard/fragments/global.ts   |  29 ++--
 src/store/modules/dashboard/fragments/service.ts  |  25 +---
 src/store/modules/dashboard/source/database.ts    |  29 ++--
 src/store/modules/dashboard/source/endpoint.ts    |  33 +++--
 src/store/modules/dashboard/source/global.ts      |  28 ++--
 src/store/modules/dashboard/source/service.ts     |  32 +++--
 src/store/modules/topology/index.ts               |  31 ++--
 13 files changed, 151 insertions(+), 438 deletions(-)

diff --git a/src/graph/fragments/comparison.ts b/src/graph/fragments/comparison.ts
index 03407cc..12f0320 100644
--- a/src/graph/fragments/comparison.ts
+++ b/src/graph/fragments/comparison.ts
@@ -14,51 +14,14 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-
 export const dependencyServerPercentile = {
   variable: '$duration: Duration!, $id: ID!',
   fragment: `
-  serverSideP50: getLinearIntValues(metric: {
-      name: "service_relation_server_p50"
-      id: $id
-    }, duration: $duration) {
-      values {
-        value
-      }
-    }
-    serverSideP75: getLinearIntValues(metric: {
-      name: "service_relation_server_p75"
-      id: $id
-    }, duration: $duration) {
-      values {
-        value
-      }
-    }
-    serverSideP90: getLinearIntValues(metric: {
-      name: "service_relation_server_p90"
-      id: $id
-    }, duration: $duration) {
-      values {
-        value
-      }
-    }
-    serverSideP95: getLinearIntValues(metric: {
-      name: "service_relation_server_p95"
-      id: $id
-    }, duration: $duration) {
-      values {
-        value
-      }
-    }
-    serverSideP99: getLinearIntValues(metric: {
-      name: "service_relation_server_p99"
-      id: $id
-    }, duration: $duration) {
-      values {
-        value
-      }
-    }
-`};
+  serverSidePercentile: getMultipleLinearIntValues(metric: {
+    name: "service_relation_server_percentile"
+    id: $id
+  }, numOfLinear: 5, duration: $duration) { values { value } }`,
+};
 
 export const dependencyServerResponseTimeTrend = {
   variable: '$duration: Duration!, $id: ID!',
@@ -137,48 +100,11 @@ export const dependencyClientSLATrend = {
       }
     }
 `};
-
 export const dependencyClientPercentile = {
   variable: '$duration: Duration!, $id: ID!',
   fragment: `
-  clientSideP50: getLinearIntValues(metric: {
-      name: "service_relation_client_p50"
-      id: $id
-    }, duration: $duration) {
-      values {
-        value
-      }
-    }
-    clientSideP75: getLinearIntValues(metric: {
-      name: "service_relation_client_p75"
-      id: $id
-    }, duration: $duration) {
-      values {
-        value
-      }
-    }
-    clientSideP90: getLinearIntValues(metric: {
-      name: "service_relation_client_p90"
-      id: $id
-    }, duration: $duration) {
-      values {
-        value
-      }
-    }
-    clientSideP95: getLinearIntValues(metric: {
-      name: "service_relation_client_p95"
-      id: $id
-    }, duration: $duration) {
-      values {
-        value
-      }
-    }
-    clientSideP99: getLinearIntValues(metric: {
-      name: "service_relation_client_p99"
-      id: $id
-    }, duration: $duration) {
-      values {
-        value
-      }
-    }
-`};
+  clientSidePercentile: getMultipleLinearIntValues(metric: {
+    name: "service_relation_client_percentile"
+    id: $id
+  }, numOfLinear: 5, duration: $duration) { values { value } }`,
+};
diff --git a/src/graph/fragments/topology.ts b/src/graph/fragments/topology.ts
index 8a5dd0f..9033d43 100644
--- a/src/graph/fragments/topology.ts
+++ b/src/graph/fragments/topology.ts
@@ -42,46 +42,10 @@ export const TopoServiceInfo = {
         value
       }
     }
-    p50: getLinearIntValues(metric: {
-      name: "service_relation_server_p50"
+    getPercentile: getMultipleLinearIntValues(metric: {
+      name: "service_relation_server_percentile",
       id: $id
-    }, duration: $duration) {
-      values {
-        value
-      }
-    }
-    p75: getLinearIntValues(metric: {
-      name: "service_relation_server_p75"
-      id: $id
-    }, duration: $duration) {
-      values {
-        value
-      }
-    }
-    p90: getLinearIntValues(metric: {
-      name: "service_relation_server_p90"
-      id: $id
-    }, duration: $duration) {
-      values {
-        value
-      }
-    }
-    p95: getLinearIntValues(metric: {
-      name: "service_relation_server_p95"
-      id: $id
-    }, duration: $duration) {
-      values {
-        value
-      }
-    }
-    p99: getLinearIntValues(metric: {
-      name: "service_relation_server_p99"
-      id: $id
-    }, duration: $duration) {
-      values {
-        value
-      }
-    }
+    }, numOfLinear: 5, duration: $duration) { values { value } }
 `};
 
 export const TopoClientInfo = {
@@ -111,46 +75,10 @@ export const TopoClientInfo = {
         value
       }
     }
-    p50: getLinearIntValues(metric: {
-      name: "service_relation_client_p50"
+    getPercentile: getMultipleLinearIntValues(metric: {
+      name: "service_relation_client_percentile",
       id: $id
-    }, duration: $duration) {
-      values {
-        value
-      }
-    }
-    p75: getLinearIntValues(metric: {
-      name: "service_relation_client_p75"
-      id: $id
-    }, duration: $duration) {
-      values {
-        value
-      }
-    }
-    p90: getLinearIntValues(metric: {
-      name: "service_relation_client_p90"
-      id: $id
-    }, duration: $duration) {
-      values {
-        value
-      }
-    }
-    p95: getLinearIntValues(metric: {
-      name: "service_relation_client_p95"
-      id: $id
-    }, duration: $duration) {
-      values {
-        value
-      }
-    }
-    p99: getLinearIntValues(metric: {
-      name: "service_relation_client_p99"
-      id: $id
-    }, duration: $duration) {
-      values {
-        value
-      }
-    }
+    }, numOfLinear: 5, duration: $duration) { values { value } }
 `};
 
 export const TopoInstanceClientInfo = {
@@ -180,46 +108,10 @@ export const TopoInstanceClientInfo = {
         value
       }
     }
-    p50: getLinearIntValues(metric: {
-      name: "service_instance_relation_client_p50"
+    getPercentile: getMultipleLinearIntValues(metric: {
+      name: "service_instance_relation_client_percentile",
       id: $id
-    }, duration: $duration) {
-      values {
-        value
-      }
-    }
-    p75: getLinearIntValues(metric: {
-      name: "service_instance_relation_client_p75"
-      id: $id
-    }, duration: $duration) {
-      values {
-        value
-      }
-    }
-    p90: getLinearIntValues(metric: {
-      name: "service_instance_relation_client_p90"
-      id: $id
-    }, duration: $duration) {
-      values {
-        value
-      }
-    }
-    p95: getLinearIntValues(metric: {
-      name: "service_instance_relation_client_p95"
-      id: $id
-    }, duration: $duration) {
-      values {
-        value
-      }
-    }
-    p99: getLinearIntValues(metric: {
-      name: "service_instance_relation_client_p99"
-      id: $id
-    }, duration: $duration) {
-      values {
-        value
-      }
-    }
+    }, numOfLinear: 5, duration: $duration) { values { value } }
 `};
 
 export const TopoInstanceServerInfo = {
@@ -249,46 +141,10 @@ export const TopoInstanceServerInfo = {
         value
       }
     }
-    p50: getLinearIntValues(metric: {
-      name: "service_instance_relation_server_p50"
+    getPercentile: getMultipleLinearIntValues(metric: {
+      name: "service_instance_relation_client_percentile",
       id: $id
-    }, duration: $duration) {
-      values {
-        value
-      }
-    }
-    p75: getLinearIntValues(metric: {
-      name: "service_instance_relation_server_p75"
-      id: $id
-    }, duration: $duration) {
-      values {
-        value
-      }
-    }
-    p90: getLinearIntValues(metric: {
-      name: "service_instance_relation_server_p90"
-      id: $id
-    }, duration: $duration) {
-      values {
-        value
-      }
-    }
-    p95: getLinearIntValues(metric: {
-      name: "service_instance_relation_server_p95"
-      id: $id
-    }, duration: $duration) {
-      values {
-        value
-      }
-    }
-    p99: getLinearIntValues(metric: {
-      name: "service_instance_relation_server_p99"
-      id: $id
-    }, duration: $duration) {
-      values {
-        value
-      }
-    }
+    }, numOfLinear: 5, duration: $duration) { values { value } }
 `};
 
 export const TopoInstanceDependency = {
diff --git a/src/store/modules/comparison/comparison-const.ts b/src/store/modules/comparison/comparison-const.ts
index 7158100..eb5fa0e 100644
--- a/src/store/modules/comparison/comparison-const.ts
+++ b/src/store/modules/comparison/comparison-const.ts
@@ -84,3 +84,4 @@ export const PercentileType: any = {
   dependencyServerPercentile: ['serverSideP50', 'serverSideP75', 'serverSideP90', 'serverSideP95', 'serverSideP99'],
   dependencyClientPercentile: ['clientSideP50', 'clientSideP75', 'clientSideP90', 'clientSideP95', 'clientSideP99'],
 };
+export const PercentileItem: string[] = ['p50', 'p75', 'p90', 'p95', 'p99'];
diff --git a/src/store/modules/comparison/comparison-store.ts b/src/store/modules/comparison/comparison-store.ts
index 7942b2e..f73b232 100644
--- a/src/store/modules/comparison/comparison-store.ts
+++ b/src/store/modules/comparison/comparison-store.ts
@@ -27,7 +27,7 @@ import fragmentAll from '@/graph/query/comparison';
 import { ICurrentOptions, DataSourceType, ISelectConfig, MetricsType } from '@/types/comparison';
 import {
   ComparisonOption, InitSource, LinearType, ComparisonType,
-  ObjectType, ServiceType, ChangeType, StatusType, PercentileType,
+  ObjectType, ServiceType, ChangeType, StatusType, PercentileItem,
 } from './comparison-const';
 
 type GenericIdentityFn<T> = (arg: T) => T;
@@ -257,25 +257,24 @@ const mutations = {
     }
   },
   [types.SET_CHARTVAL](state: State, data: {value: any, type: string}) {
-    const { preObject, preService, preType, preMetrics } = state.currentOptions;
-    const { nextObject, nextService, nextType, nextMetrics } = state.currentOptions;
-    const metrics = data.type === ServiceType.PREVIOUS ? preMetrics : nextMetrics;
+    const { preObject, preService, preType } = state.currentOptions;
+    const { nextObject, nextService, nextType } = state.currentOptions;
     const obj = {} as any;
+
     for (const key of Object.keys(data.value)) {
-      const value = data.value[key].values.map((d: {value: number}) => d.value);
-      obj[key] = value;
-    }
-    for (const metric of metrics) {
-      const title = metric.key;
-      const percentile = PercentileType[title];
-      if (percentile) {
-        obj[metric.label] = {};
-        for (const item of percentile) {
-          obj[metric.label][item] = obj[item];
-          delete obj[item];
-        }
+      let value = [] as any;
+
+      if (Array.isArray(data.value[key].values)) {
+        value = data.value[key].values.map((d: {value: number}) => d.value);
+      } else {
+        value = {};
+        PercentileItem.forEach((item, index) => {
+          value[item] = data.value[key][index].values.map((d: {value: number}) => d.value);
+        });
       }
+      obj[key] = value;
     }
+
     for (const key of Object.keys(obj)) {
       if (data.type === ServiceType.PREVIOUS) {
         const str = `${preService.label}_`;
diff --git a/src/store/modules/dashboard/fragments/database.ts b/src/store/modules/dashboard/fragments/database.ts
index d12275f..e438800 100644
--- a/src/store/modules/dashboard/fragments/database.ts
+++ b/src/store/modules/dashboard/fragments/database.ts
@@ -51,69 +51,13 @@ export const databaseSLA =  {
     }
   }`,
 };
-export const databaseP99 =  {
+export const databasePercent = {
   variable: ['$databaseId: ID!', '$duration: Duration!'],
   fragment: `
-  databaseP99: getLinearIntValues(metric: {
-    name: "database_access_p99"
+  databasePercentile: getMultipleLinearIntValues(metric: {
+    name: "database_access_percentile"
     id: $databaseId
-  }, duration: $duration) { values { value } }`,
-};
-export const databaseP95 =  {
-  variable: ['$databaseId: ID!', '$duration: Duration!'],
-  fragment: `
-  databaseP99: getLinearIntValues(metric: {
-    name: "database_access_p95"
-    id: $databaseId
-  }, duration: $duration) { values { value } }`,
-};
-export const databaseP90 =  {
-  variable: ['$databaseId: ID!', '$duration: Duration!'],
-  fragment: `
-  databaseP99: getLinearIntValues(metric: {
-    name: "database_access_p90"
-    id: $databaseId
-  }, duration: $duration) { values { value } }`,
-};
-export const databaseP75 =  {
-  variable: ['$databaseId: ID!', '$duration: Duration!'],
-  fragment: `
-  databaseP99: getLinearIntValues(metric: {
-    name: "database_access_p75"
-    id: $databaseId
-  }, duration: $duration) { values { value } }`,
-};
-export const databaseP50 =  {
-  variable: ['$databaseId: ID!', '$duration: Duration!'],
-  fragment: `
-  databaseP99: getLinearIntValues(metric: {
-    name: "database_access_p50"
-    id: $databaseId
-  }, duration: $duration) { values { value } }`,
-};
-export const databasePercent =  {
-  variable: ['$databaseId: ID!', '$duration: Duration!'],
-  fragment: `
-  databaseP99: getLinearIntValues(metric: {
-    name: "database_access_p99"
-    id: $databaseId
-  }, duration: $duration) { values { value } }
-  databaseP95: getLinearIntValues(metric: {
-    name: "database_access_p95"
-    id: $databaseId
-  }, duration: $duration) { values { value } }
-  databaseP90: getLinearIntValues(metric: {
-    name: "database_access_p90"
-    id: $databaseId
-  }, duration: $duration) { values { value } }
-  databaseP75: getLinearIntValues(metric: {
-    name: "database_access_p75"
-    id: $databaseId
-  }, duration: $duration) { values { value } }
-  databaseP50: getLinearIntValues(metric: {
-    name: "database_access_p50"
-    id: $databaseId
-  }, duration: $duration) { values { value } }`,
+  }, numOfLinear: 5, duration: $duration) { values { value } }`,
 };
 
 export const databaseTopNRecords =  {
diff --git a/src/store/modules/dashboard/fragments/endpoint.ts b/src/store/modules/dashboard/fragments/endpoint.ts
index 7d5f9f6..e2c8026 100644
--- a/src/store/modules/dashboard/fragments/endpoint.ts
+++ b/src/store/modules/dashboard/fragments/endpoint.ts
@@ -51,29 +51,13 @@ export const endpointSLA =  {
     }
   }`,
 };
-export const endpointPercent =  {
+export const endpointPercent = {
   variable: ['$endpointId: ID!', '$duration: Duration!'],
   fragment: `
-  endpointP99: getLinearIntValues(metric: {
-    name: "endpoint_p99"
+  endpointPercentile: getMultipleLinearIntValues(metric: {
+    name: "endpoint_percentile"
     id: $endpointId
-  }, duration: $duration) { values { value } }
-  endpointP95: getLinearIntValues(metric: {
-    name: "endpoint_p95"
-    id: $endpointId
-  }, duration: $duration) { values { value } }
-  endpointP90: getLinearIntValues(metric: {
-    name: "endpoint_p90"
-    id: $endpointId
-  }, duration: $duration) { values { value } }
-  endpointP75: getLinearIntValues(metric: {
-    name: "endpoint_p75"
-    id: $endpointId
-  }, duration: $duration) { values { value } }
-  endpointP50: getLinearIntValues(metric: {
-    name: "endpoint_p50"
-    id: $endpointId
-  }, duration: $duration) { values { value } }`,
+  }, numOfLinear: 5, duration: $duration) { values { value } }`,
 };
 
 export const endpointTopology =  {
diff --git a/src/store/modules/dashboard/fragments/global.ts b/src/store/modules/dashboard/fragments/global.ts
index 977be70..1a0c75a 100644
--- a/src/store/modules/dashboard/fragments/global.ts
+++ b/src/store/modules/dashboard/fragments/global.ts
@@ -16,7 +16,7 @@
  */
 
 
-export const globalBrief =  {
+export const globalBrief = {
   variable: ['$duration: Duration!'],
   fragment: `
   globalBrief: getGlobalBrief(duration: $duration) {
@@ -24,7 +24,7 @@ export const globalBrief =  {
   }`,
 };
 
-export const globalHeatmap =  {
+export const globalHeatmap = {
   variable: ['$duration: Duration!'],
   fragment: `
   globalHeatmap: getThermodynamic(duration: $duration, metric: {
@@ -33,27 +33,14 @@ export const globalHeatmap =  {
     nodes responseTimeStep: axisYStep
   }`,
 };
-
-export const globalPercent =  {
+export const globalPercent = {
   variable: ['$duration: Duration!'],
   fragment: `
-  globalP99: getLinearIntValues(metric: {
-    name: "all_p99"
-  }, duration: $duration) { values { value } }
-  globalP95: getLinearIntValues(metric: {
-    name: "all_p95"
-  }, duration: $duration) { values { value } }
-  globalP90: getLinearIntValues(metric: {
-    name: "all_p90"
-  }, duration: $duration) { values { value } }
-  globalP75: getLinearIntValues(metric: {
-    name: "all_p75"
-  }, duration: $duration) { values { value } }
-  globalP50: getLinearIntValues(metric: {
-    name: "all_p50"
-  }, duration: $duration) { values { value } }`,
+  globalPercentile: getMultipleLinearIntValues(metric: {
+    name: "all_percentile"
+  }, numOfLinear: 5, duration: $duration) { values { value } }`,
 };
-export const globalSlow =  {
+export const globalSlow = {
   variable: ['$duration: Duration!'],
   fragment: `
   globalSlow: getAllEndpointTopN(
@@ -65,7 +52,7 @@ export const globalSlow =  {
     key: id label: name value
   }`,
 };
-export const globalThroughput =  {
+export const globalThroughput = {
   variable: ['$duration: Duration!'],
   fragment: `
   globalThroughput: getServiceTopN(
diff --git a/src/store/modules/dashboard/fragments/service.ts b/src/store/modules/dashboard/fragments/service.ts
index d7ba424..f7923b4 100644
--- a/src/store/modules/dashboard/fragments/service.ts
+++ b/src/store/modules/dashboard/fragments/service.ts
@@ -51,29 +51,14 @@ export const serviceSLA =  {
     }
   }`,
 };
-export const servicePercent =  {
+
+export const servicePercent = {
   variable: ['$serviceId: ID!', '$duration: Duration!'],
   fragment: `
-  serviceP99: getLinearIntValues(metric: {
-    name: "service_p99"
-    id: $serviceId
-  }, duration: $duration) { values { value } }
-  serviceP95: getLinearIntValues(metric: {
-    name: "service_p95"
-    id: $serviceId
-  }, duration: $duration) { values { value } }
-  serviceP90: getLinearIntValues(metric: {
-    name: "service_p90"
-    id: $serviceId
-  }, duration: $duration) { values { value } }
-  serviceP75: getLinearIntValues(metric: {
-    name: "service_p75"
-    id: $serviceId
-  }, duration: $duration) { values { value } }
-  serviceP50: getLinearIntValues(metric: {
-    name: "service_p50"
+  servicePercentile: getMultipleLinearIntValues(metric: {
+    name: "service_percentile"
     id: $serviceId
-  }, duration: $duration) { values { value } }`,
+  }, numOfLinear: 5, duration: $duration) { values { value } }`,
 };
 
 export const serviceSlowEndpoint =  {
diff --git a/src/store/modules/dashboard/source/database.ts b/src/store/modules/dashboard/source/database.ts
index bc9dd50..7442748 100644
--- a/src/store/modules/dashboard/source/database.ts
+++ b/src/store/modules/dashboard/source/database.ts
@@ -47,28 +47,35 @@ export const initState: State = {
 };
 
 export const SetDatabase = (state: State, params: any) => {
-  if (params && params.databaseResponseTime) {
+  if (!params) {
+    return;
+  }
+  if (params.databaseResponseTime) {
     state.databaseResponseTime.ResponseTime = params.databaseResponseTime.values.map((i: Value) => i.value);
   }
-  if (params && params.databaseSLA) {
+  if (params.databaseSLA) {
     state.databaseSLA.SLA = params.databaseSLA.values.map((i: Value) => i.value / 100);
   }
-  if (params && params.databaseP50
-    && params.databaseP75 && params.databaseP90 && params.databaseP95 && params.databaseP99) {
-    state.databasePercent.p50 = params.databaseP50.values.map((i: Value) => i.value);
-    state.databasePercent.p75 = params.databaseP75.values.map((i: Value) => i.value);
-    state.databasePercent.p90 = params.databaseP90.values.map((i: Value) => i.value);
-    state.databasePercent.p95 = params.databaseP95.values.map((i: Value) => i.value);
-    state.databasePercent.p99 = params.databaseP99.values.map((i: Value) => i.value);
+  if (params.databasePercentile) {
+    const PercentileItem = ['p50', 'p75', 'p90', 'p95', 'p99'] as string[];
+    const databasePercent = {} as any;
+
+    params.databasePercentile.forEach((item: any, index: number) => {
+      if (item && item.values) {
+        const key = PercentileItem[index] as string;
+        databasePercent[key] = item.values.map((i: any) => i.value);
+      }
+    });
+    state.databasePercent = databasePercent;
   }
-  if (params && params.databaseTopNRecords) {
+  if (params.databaseTopNRecords) {
     state.databaseTopNRecords = params.databaseTopNRecords.map((i: any) => ({
       key: i.traceId,
       label: i.statement,
       value: i.latency,
     }));
   }
-  if (params && params.databaseThroughput) {
+  if (params.databaseThroughput) {
     state.databaseThroughput.Throughput = params.databaseThroughput.values.map((i: Value) => i.value);
   }
 };
diff --git a/src/store/modules/dashboard/source/endpoint.ts b/src/store/modules/dashboard/source/endpoint.ts
index cf4f862..9e1097d 100644
--- a/src/store/modules/dashboard/source/endpoint.ts
+++ b/src/store/modules/dashboard/source/endpoint.ts
@@ -52,27 +52,34 @@ export const initState: State = {
 
 
 export const SetEndpoint = (state: State, params: any) => {
-  if (params &&
-    params.endpointP50 && params.endpointP75 && params.endpointP90 && params.endpointP95 && params.endpointP99) {
-    state.endpointPercent.p50 = params.endpointP50.values.map((i: Value) => i.value);
-    state.endpointPercent.p75 = params.endpointP75.values.map((i: Value) => i.value);
-    state.endpointPercent.p90 = params.endpointP90.values.map((i: Value) => i.value);
-    state.endpointPercent.p95 = params.endpointP95.values.map((i: Value) => i.value);
-    state.endpointPercent.p99 = params.endpointP99.values.map((i: Value) => i.value);
+  if (!params) {
+    return;
   }
-  if (params && params.endpointResponseTime) {
+  if (params.endpointPercentile) {
+    const PercentileItem = ['p50', 'p75', 'p90', 'p95', 'p99'] as string[];
+    const endpointPercent = {} as any;
+
+    params.endpointPercentile.forEach((item: any, index: number) => {
+      if (item && item.values) {
+        const key = PercentileItem[index] as string;
+        endpointPercent[key] = item.values.map((i: any) => i.value);
+      }
+    });
+    state.endpointPercent = endpointPercent;
+  }
+  if (params.endpointResponseTime) {
     state.endpointResponseTime.ResponseTime = params.endpointResponseTime.values.map((i: Value) => i.value);
   }
-  if (params && params.endpointThroughput) {
+  if (params.endpointThroughput) {
     state.endpointThroughput.Throughput = params.endpointThroughput.values.map((i: Value) => i.value);
   }
-  if (params && params.endpointSLA) {
+  if (params.endpointSLA) {
     state.endpointSLA.SLA = params.endpointSLA.values.map((i: Value) => i.value / 100);
   }
-  if (params && params.endpointSlowEndpoint) {
+  if (params.endpointSlowEndpoint) {
     state.endpointSlowEndpoint = params.endpointSlowEndpoint;
   }
-  if (params && params.endpointTopology) {
+  if (params.endpointTopology) {
     const serviceIdxMap = params.endpointTopology.endpoints.map((e: any) => (e.serviceName)).filter(
       function onlyUnique(value: any, index: number, self: any) {
         return self.indexOf(value) === index;
@@ -103,7 +110,7 @@ export const SetEndpoint = (state: State, params: any) => {
       top: 'top',
     }];
   }
-  if (params && params.endpointTraces) {
+  if (params.endpointTraces) {
     state.endpointTraces = params.endpointTraces.traces.map((i: any) => ({
       key: i.key,
       label: i.endpointNames[0],
diff --git a/src/store/modules/dashboard/source/global.ts b/src/store/modules/dashboard/source/global.ts
index e23dea8..d4e9f39 100644
--- a/src/store/modules/dashboard/source/global.ts
+++ b/src/store/modules/dashboard/source/global.ts
@@ -61,7 +61,10 @@ export const initState: State = {
 
 
 export const SetGlobal = (state: State, params: any) => {
-  if (params && params.globalBrief) {
+  if (!params) {
+    return;
+  }
+  if (params.globalBrief) {
     state.globalBrief.numOfCache = params.globalBrief.numOfCache || 0;
     state.globalBrief.numOfDatabase = params.globalBrief.numOfDatabase || 0;
     state.globalBrief.numOfEndpoint = params.globalBrief.numOfEndpoint || 0;
@@ -69,20 +72,25 @@ export const SetGlobal = (state: State, params: any) => {
     state.globalBrief.numOfService = params.globalBrief.numOfService || 0;
 
   }
-  if (params && params.globalP50 && params.globalP75 && params.globalP90 && params.globalP95 && params.globalP99) {
-    state.globalPercent.p50 = params.globalP50.values.map((i: Value) => i.value);
-    state.globalPercent.p75 = params.globalP75.values.map((i: Value) => i.value);
-    state.globalPercent.p90 = params.globalP90.values.map((i: Value) => i.value);
-    state.globalPercent.p95 = params.globalP95.values.map((i: Value) => i.value);
-    state.globalPercent.p99 = params.globalP99.values.map((i: Value) => i.value);
+  if (params.globalPercentile) {
+    const PercentileItem = ['p50', 'p75', 'p90', 'p95', 'p99'];
+    const globalPercent = {} as any;
+
+    params.globalPercentile.forEach((item: any, index: number) => {
+      if (item && item.values) {
+        const key = PercentileItem[index] as string;
+        globalPercent[key] = item.values.map((i: any) => i.value);
+      }
+    });
+    state.globalPercent = globalPercent;
   }
-  if (params && params.globalHeatmap) {
+  if (params.globalHeatmap) {
     state.globalHeatmap = params.globalHeatmap.nodes;
   }
-  if (params && params.globalSlow) {
+  if (params.globalSlow) {
     state.globalSlow = params.globalSlow;
   }
-  if (params && params.globalThroughput) {
+  if (params.globalThroughput) {
     state.globalThroughput = params.globalThroughput;
   }
 };
diff --git a/src/store/modules/dashboard/source/service.ts b/src/store/modules/dashboard/source/service.ts
index 5f39380..7cebae4 100644
--- a/src/store/modules/dashboard/source/service.ts
+++ b/src/store/modules/dashboard/source/service.ts
@@ -51,29 +51,37 @@ export const initState: State = {
 };
 
 export const SetService = (state: State, params: any) => {
-  if (params && params.serviceResponseTime) {
+  if (!params) {
+    return;
+  }
+  if (params.serviceResponseTime) {
     state.serviceResponseTime.ResponseTime = params.serviceResponseTime.values.map((i: Value) => i.value);
   }
-  if (params && params.serviceInstanceThroughput) {
+  if (params.serviceInstanceThroughput) {
     state.serviceInstanceThroughput = params.serviceInstanceThroughput;
   }
-  if (params && params.serviceSLA) {
+  if (params.serviceSLA) {
     state.serviceSLA.SLA = params.serviceSLA.values.map((i: Value) => i.value / 100);
   }
-  if (params && params.serviceP50 && params.serviceP75 && params.serviceP90 && params.serviceP95 && params.serviceP99) {
-    state.servicePercent.p50 = params.serviceP50.values.map((i: Value) => i.value);
-    state.servicePercent.p75 = params.serviceP75.values.map((i: Value) => i.value);
-    state.servicePercent.p90 = params.serviceP90.values.map((i: Value) => i.value);
-    state.servicePercent.p95 = params.serviceP95.values.map((i: Value) => i.value);
-    state.servicePercent.p99 = params.serviceP99.values.map((i: Value) => i.value);
+  if (params.servicePercentile) {
+    const PercentileItem = ['p50', 'p75', 'p90', 'p95', 'p99'];
+    const servicePercent = {} as any;
+
+    params.servicePercentile.forEach((item: any, index: number) => {
+      if (item && item.values) {
+        const key = PercentileItem[index] as string;
+        servicePercent[key] = item.values.map((i: any) => i.value);
+      }
+    });
+    state.servicePercent = servicePercent;
   }
-  if (params && params.serviceSlowEndpoint) {
+  if (params.serviceSlowEndpoint) {
     state.serviceSlowEndpoint = params.serviceSlowEndpoint;
   }
-  if (params && params.serviceThroughput) {
+  if (params.serviceThroughput) {
     state.serviceThroughput.Throughput = params.serviceThroughput.values.map((i: Value) => i.value);
   }
-  if (params && params.serviceApdexScore) {
+  if (params.serviceApdexScore) {
     state.serviceApdexScore.ApdexScore =
       params.serviceApdexScore.values.map((i: any) => Number((i.value / 10000).toFixed(2)));
   }
diff --git a/src/store/modules/topology/index.ts b/src/store/modules/topology/index.ts
index ab19cc7..f51d5ff 100644
--- a/src/store/modules/topology/index.ts
+++ b/src/store/modules/topology/index.ts
@@ -74,6 +74,8 @@ export interface State {
   queryInstanceMetricsType: string;
 }
 
+const PercentileItem: string[] = ['p50', 'p75', 'p90', 'p95', 'p99'];
+
 const initState: State = {
   callback: '',
   mode: true,
@@ -152,11 +154,14 @@ const mutations = {
     data.getResponseTimeTrend.values.map((i: any) => i.value) : [];
     state.getSLATrend = data.getSLATrend ? data.getSLATrend.values.map((i: any) => i.value) : [];
     state.getThroughputTrend = data.getThroughputTrend ? data.getThroughputTrend.values.map((i: any) => i.value) : [];
-    state.responsePercentile.p50 = data.p50 ? data.p50.values.map((i: any) => i.value) : [];
-    state.responsePercentile.p75 = data.p75 ? data.p75.values.map((i: any) => i.value) : [];
-    state.responsePercentile.p90 = data.p90 ? data.p90.values.map((i: any) => i.value) : [];
-    state.responsePercentile.p95 = data.p95 ? data.p95.values.map((i: any) => i.value) : [];
-    state.responsePercentile.p99 = data.p99 ? data.p99.values.map((i: any) => i.value) : [];
+
+    if (!data.getPercentile) {
+      state.responsePercentile = {};
+      return;
+    }
+    data.getPercentile.forEach((item: any, index: number) => {
+      state.responsePercentile[PercentileItem[index]] = item.values.map((i: any) => i.value);
+    });
   },
   [types.SET_INSTANCE_DEPENDENCY](state: State, data: any) {
     state.instanceDependency = data;
@@ -172,11 +177,12 @@ const mutations = {
     state.instanceDependencyMetrics.getThroughputTrend = data.getThroughputTrend ?
     data.getThroughputTrend.values.map((i: any) => i.value) : [];
     state.instanceDependencyMetrics.percentResponse = {};
-    state.instanceDependencyMetrics.percentResponse.p50 = data.p50 ? data.p50.values.map((i: any) => i.value) : [];
-    state.instanceDependencyMetrics.percentResponse.p75 = data.p75 ? data.p75.values.map((i: any) => i.value) : [];
-    state.instanceDependencyMetrics.percentResponse.p90 = data.p90 ? data.p90.values.map((i: any) => i.value) : [];
-    state.instanceDependencyMetrics.percentResponse.p95 = data.p95 ? data.p95.values.map((i: any) => i.value) : [];
-    state.instanceDependencyMetrics.percentResponse.p99 = data.p99 ? data.p99.values.map((i: any) => i.value) : [];
+    if (!data.getPercentile) {
+      return;
+    }
+    data.getPercentile.forEach((item: any, index: number) => {
+      state.instanceDependencyMetrics.percentResponse[PercentileItem[index]] = item.values.map((i: any) => i.value);
+    });
   },
   [types.SET_INSTANCE_DEPEDENCE_TYPE](state: State, data: string) {
     state.queryInstanceMetricsType = data;
@@ -255,11 +261,6 @@ const actions: ActionTree<State, any> = {
                   sla: resInfo.sla.values[i].value ? resInfo.sla.values[i].value / 100 : -1,
                   cpm: resInfo.nodeCpm.values[i] ? resInfo.nodeCpm.values[i].value : -1,
                   latency: resInfo.nodeLatency.values[i] ? resInfo.nodeLatency.values[i].value : -1,
-                  p50: resInfo.p50 && resInfo.p50.values[i] ? resInfo.p50.values[i].value : 0,
-                  p75: resInfo.p75 && resInfo.p75.values[i] ? resInfo.p75.values[i].value : 0,
-                  p90: resInfo.p90 && resInfo.p90.values[i] ? resInfo.p90.values[i].value : 0,
-                  p95: resInfo.p95 && resInfo.p95.values[i] ? resInfo.p95.values[i].value : 0,
-                  p99: resInfo.p95 && resInfo.p95.values[i] ? resInfo.p95.values[i].value : 0,
                 };
               }
             }