Instantly share code, notes, and snippets.

Embed
What would you like to do?
Ibex dashboard template to make App Insights dashboard for Mixed Reality / HoloLens. (Usage: Import this template into Ibex Dashboard and config using your App Insights key)
/// <reference path="../../../client/@types/types.d.ts"/>
import * as _ from 'lodash';
export const config: IDashboardConfig = /*return*/ {
id: "mr_sample",
name: "Mixed Reality dashboard",
icon: "dashboard",
url: "mr_sample",
description: "Mixed Reality dashboard sample",
preview: "/images/sample.png",
category: "Custom Templates",
html: `<div>
Sample dashboard to display Mixed Reality Application Insights.
</div>`,
config: {
connections: { },
layout: {
isDraggable: true,
isResizable: true,
rowHeight: 30,
verticalCompact: false,
cols: { lg: 12,md: 10,sm: 6,xs: 4,xxs: 2 },
breakpoints: { lg: 1200,md: 996,sm: 768,xs: 480,xxs: 0 }
}
},
dataSources: [
{
id: "timespan",
type: "Constant",
params: { values: ["24 hours","1 week","1 month"],selectedValue: "1 week" },
format: "timespan"
},
{
id: "customEvents",
type: "ApplicationInsights/Query",
dependencies: { timespan: "timespan",queryTimespan: "timespan:queryTimespan",granularity: "timespan:granularity" },
params: {
table: "customEvents",
queries: {
total: {
query: () => {
return `summarize total=count()`
},
format: {
type: "scorecard",
args: {
countField: "total",
thresholds: [{ value: 0,color: "#ff0000",icon: "pan_tool",heading: "Interactions" }]
}
}
},
totals: {
query: () => {
return `
summarize total=count() by name
| order by total
`
},
format: { type: "bars",args: { barsField: "name",seriesField: "name",valueField: "total" } }
}
}
}
},
{
id: "customMetrics",
type: "ApplicationInsights/Query",
dependencies: { timespan: "timespan",queryTimespan: "timespan:queryTimespan",granularity: "timespan:granularity" },
params: {
table: "customMetrics",
queries: {
gazeTotal: {
query: () => {
return `summarize total=round(sum(value),1)`
},
format: {
type: "scorecard",
args: {
countField: "total",
thresholds: [{ value: 0,color: "#0066ff",icon: "visibility",heading: "Gaze" }]
}
}
},
gazeTotals: {
query: () => {
return `summarize total=round(sum(value),1) by name`
},
format: { type: "pie",args: { barsField: "name",seriesField: "name",value: "total" } }
},
gazeTime: {
query: ({ granularity }) => {
return `
summarize total=round(sum(value),1) by bin(timestamp, ${granularity}), name
| order by timestamp asc
`
},
format: { type: "timeline",args: { lineField: "name",valueField: "total",timeField: "timestamp" } }
}
}
}
}
],
filters: [
{
type: "TextFilter",
title: "Timespan",
source: "timespan",
actions: { onChange: "timespan:updateSelectedValue" },
first: true
}
],
elements: [
{
id: "gazingTotals",
type: "PieData",
title: "Gaze duration",
subtitle: "How many seconds an object is gazed at",
size: { w: 5,h: 7 },
source: "customMetrics:gazeTotals",
props: { showLegend: true,entityType: "Seconds",compact: false }
},
{
id: "gaze",
type: "Timeline",
title: "Gaze durations",
subtitle: "The gazed duration over time",
size: { w: 7,h: 7 },
source: "customMetrics:gazeTime",
props: { showLegend: false }
},
{
id: "spatial",
type: "BarData",
title: "Total interactions",
subtitle: "The objects with most interactions",
size: { w: 5,h: 6 },
source: "customEvents:totals",
props: { showLegend: false }
},
{
id: "totalEvents",
type: "Scorecard",
title: "Spatial",
subtitle: "Total number of spatial interactions",
size: { w: 2,h: 2 },
source: { 1: "customEvents:total" }
},
{
id: "totalMetrics",
type: "Scorecard",
title: "Gaze",
subtitle: "Total seconds gazed",
size: { w: 2,h: 2 },
source: { 1: "customMetrics:gazeTotal" }
}
],
dialogs: []
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment