Skip to content

Instantly share code, notes, and snippets.

@hexfusion
Last active November 5, 2020 13:56
Show Gist options
  • Save hexfusion/4f6ec433c34019b51b14ed089865962a to your computer and use it in GitHub Desktop.
Save hexfusion/4f6ec433c34019b51b14ed089865962a to your computer and use it in GitHub Desktop.
azure metrics query and graph with chartjs
#!/bin/bash
#set -x
# usage example
# ./script.sh \
# /subscriptions/8XXXba4b-XXXX-446a-XXXX-a9XXXXXe3d/resourceGroups/SBATSCHE-METRICS-2020-NSW5W-RG/providers/Microsoft.Compute/virtualMachines/sbatsche-metrics-2020-nsw5w-master-0 \
# date +%FT%TZ -d "3 day ago" \
# date +%FT%TZ -d "2 day ago"
if ! command -v az &> /dev/null
then
echo "az cli could not be found. see https://docs.microsoft.com/en-us/cli/azure/install-azure-cli"
exit
fi
if [ -z "$1" ]; then
echo "id is a requiured param ./script.sh $id"
exit 1
fi
# to get the list of vm resource ids
# az vm list --query '[*].id'
ID=$1
OUT=$PWD/chart-$(date +"%s").html
# STATE_DATE default 1 day ago
if [ -z "$2" ]; then
START_DATE=$(date +%FT%TZ -d "1 day ago")
else
START_DATE=$(date +%FT%TZ -d "$2")
fi
# END_DATE default now
if [ -z "$3" ]; then
END_DATE=$(date +%FT%TZ)
else
END_DATE=$(date +%FT%TZ -d "$3")
fi
function query_metrics() {
local id="$1"
local start_time="$2"
local end_time="$3"
local metric="$4"
az monitor metrics list \
--resource $id \
--start-time ${start_time} \
--end-time ${end_time} \
--query 'value[*].timeseries[*].data[*].{x: timeStamp, y: average} | [0][0]' \
--metric "${metric}"
}
### Queries
echo "Running azure metrics queries.."
echo "OS Disk Bandwidth Consumed Percentage"
DISK_BANDWIDTH_CONSUMED=$(query_metrics $ID $START_DATE $END_DATE "OS Disk Bandwidth Consumed Percentage")
echo "OS Disk IOPS Consumed Percentage"
DISK_IOPS_CONSUMED=$(query_metrics $ID $START_DATE $END_DATE "OS Disk IOPS Consumed Percentage")
echo "VM Uncached IOPS Consumed Percentage"
VM_UNCACHED_IOPS_CONSUMED=$(query_metrics $ID $START_DATE $END_DATE "VM Uncached IOPS Consumed Percentage")
echo "VM Uncached Bandwidth Consumed Percentage"
VM_UNCACHED_BANDWIDTH_CONSUMED=$(query_metrics $ID $START_DATE $END_DATE "VM Uncached Bandwidth Consumed Percentage")
echo "Queries complete saving chart to $OUT"
cat > "$OUT" << EOF
<!doctype html>
<html>
<head>
<title>Line Chart</title>
<script src="http://cdnjs.cloudflare.com/ajax/libs/moment.js/2.13.0/moment.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.3/Chart.bundle.js"></script>
<style>
canvas {
-moz-user-select: none;
-webkit-user-select: none;
-ms-user-select: none;
}
</style>
</head>
<body>
<div style="width:75%;">
<canvas id="canvas"></canvas>
</div>
<script>
var timeFormat = 'YYYY-MM-DDTh:mm:ss';
var config = {
type: 'line',
data: {
datasets: [
{
label: "OS Disk Bandwidth Consumed Percentage",
data:
$DISK_BANDWIDTH_CONSUMED,
fill: false,
borderColor: 'red'
},
{
label: "OS Disk IOPS Consumed Percentage",
data:
$DISK_IOPS_CONSUMED,
fill: false,
borderColor: 'blue'
},
{
label: "VM Uncached IOPS Consumed Percentage",
data:
$VM_UNCACHED_IOPS_CONSUMED,
fill: false,
borderColor: 'green'
},
{
label: "VM Uncached IOPS Consumed Percentage",
data:
$VM_UNCACHED_BANDWIDTH_CONSUMED,
fill: false,
borderColor: 'yellow'
}
]
},
options: {
responsive: true,
title: {
display: true,
text: "Azure metrics"
},
scales: {
xAxes: [{
type: "time",
time: {
format: timeFormat,
tooltipFormat: 'll'
},
scaleLabel: {
display: true,
labelString: 'time'
}
}],
yAxes: [
{
ticks: {
min: 0,
max: 100
},
scaleLabel: {
display: true,
labelString: 'percentage'
}
}]
}
}
};
window.onload = function () {
var ctx = document.getElementById("canvas").getContext("2d");
window.myLine = new Chart(ctx, config);
};
</script>
</body>
</html>
EOF
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment