Importe o dashboard Data Transferred

Você pode importar um dashboard do Grafana que mostra em gráficos os dados e a largura de banda que suas aplicações transferem, lidos do Real-Time Metrics por um data source GraphQL. Os oito painéis dele são Cache, Edge Offload, Saved Data, Missed Data, Total Bandwidth Usage, Bandwidth Offloaded, Saved Bandwidth e Missed Bandwidth. Eles leem os mesmos campos que os gráficos do dashboard Data Transferred no Azion Console. Para importar em vez dele o dashboard que o plugin da Azion para Grafana instala, consulte Importe o dashboard pré-configurado do Grafana.

Pré-requisitos

Uma instância do Grafana em que você pode adicionar um data source e importar um dashboard.
O plugin GraphQL Data Source, fifemon-graphql-datasource, instalado nessa instância. O dashboard se vincula a esse plugin, não ao plugin da Azion para Grafana.
Um personal token da sua conta Azion.
Pelo menos uma aplicação com tráfego no intervalo que você mostra nos gráficos, para que os painéis tenham dados para desenhar.

Adicione o data source GraphQL

A API responde a uma query somente quando a requisição traz o seu personal token, por isso o data source envia o token em um header. Para adicionar o data source no Grafana:

Adicione um GraphQL Data Source

No Grafana, adicione um data source do tipo GraphQL Data Source.

Defina a URL

Insira https://api.azion.com/v4/metrics/graphql como URL do data source.

Adicione o header de autorização

Adicione o header Authorization com o valor Token [TOKEN VALUE]. Substitua [TOKEN VALUE] pelo seu personal token.

Salve o data source

O data source envia cada query ao endpoint v4 com o seu token. Os oito painéis consultam o dataset httpMetrics, então esse único data source atende o dashboard inteiro. Um data source configurado com o host legado https://api.azionapi.net/metrics/graphql recebe HTTP 403 e uma página de erro em HTML em vez de dados.

Importe o JSON do dashboard

O modelo do dashboard declara uma entrada de data source, DS_AZION, com o rótulo Azion e o tipo fifemon-graphql-datasource. Durante a importação, o Grafana pede que você escolha um data source para essa entrada. O modelo também lista o Grafana 9.2.5 e a versão 1.0.0 do plugin como requisitos. Para importar o dashboard:

Copie o modelo do dashboard

Copie o JSON desta seção.

Inicie a importação

No Grafana, importe um dashboard e cole o JSON como modelo do dashboard.

Selecione o data source

Para a entrada Azion, selecione o data source GraphQL que você adicionou.

Conclua a importação

O Grafana salva um dashboard com o título Data Transferred e as tags Azion, Applications e Data Transferred. Ele abre nos últimos 7 dias e atualiza a cada 30 segundos.

O modelo do dashboard:

JSON

01{

02 "__inputs": [

03 {

04 "name": "DS_AZION",

05 "label": "Azion",

06 "description": "",

07 "type": "datasource",

08 "pluginId": "fifemon-graphql-datasource",

09 "pluginName": "GraphQL Data Source"

10 }

11 ],

12 "__elements": {},

13 "__requires": [

14 {

15 "type": "datasource",

16 "id": "fifemon-graphql-datasource",

17 "name": "GraphQL Data Source",

18 "version": "1.0.0"

19 },

20 {

21 "type": "grafana",

22 "id": "grafana",

23 "name": "Grafana",

24 "version": "9.2.5"

25 },

26 {

27 "type": "panel",

28 "id": "timeseries",

29 "name": "Time series",

30 "version": ""

31 }

32 ],

33 "annotations": {

34 "list": [

35 {

36 "builtIn": 1,

37 "datasource": {

38 "type": "grafana",

39 "uid": "-- Grafana --"

40 },

41 "enable": true,

42 "hide": true,

43 "iconColor": "rgba(0, 211, 255, 1)",

44 "name": "Annotations & Alerts",

45 "target": {

46 "limit": 100,

47 "matchAny": false,

48 "tags": [],

49 "type": "dashboard"

50 },

51 "type": "dashboard"

52 }

53 ]

54 },

55 "description": "",

56 "editable": true,

57 "fiscalYearStartMonth": 0,

58 "graphTooltip": 0,

59 "id": null,

60 "links": [],

61 "liveNow": false,

62 "panels": [

63 {

64 "datasource": {

65 "type": "fifemon-graphql-datasource",

66 "uid": "${DS_AZION}"

67 },

68 "fieldConfig": {

69 "defaults": {

70 "color": {

71 "mode": "palette-classic"

72 },

73 "custom": {

74 "axisCenteredZero": false,

75 "axisColorMode": "text",

76 "axisLabel": "",

77 "axisPlacement": "auto",

78 "barAlignment": 0,

79 "drawStyle": "line",

80 "fillOpacity": 0,

81 "gradientMode": "none",

82 "hideFrom": {

83 "legend": false,

84 "tooltip": false,

85 "viz": false

86 },

87 "lineInterpolation": "linear",

88 "lineWidth": 1,

89 "pointSize": 5,

90 "scaleDistribution": {

91 "type": "linear"

92 },

93 "showPoints": "auto",

94 "spanNulls": false,

95 "stacking": {

96 "group": "A",

97 "mode": "none"

98 },

99 "thresholdsStyle": {

100 "mode": "off"

101 }

102 },

103 "mappings": [],

104 "thresholds": {

105 "mode": "absolute",

106 "steps": [

107 {

108 "color": "green",

109 "value": null

110 },

111 {

112 "color": "red",

113 "value": 80

114 }

115 ]

116 },

117 "unit": "decbytes"

118 },

119 "overrides": [

120 {

121 "matcher": {

122 "id": "byName",

123 "options": "dataTransferredIn"

124 },

125 "properties": [

126 {

127 "id": "displayName",

128 "value": "Applications In"

129 }

130 ]

131 },

132 {

133 "matcher": {

134 "id": "byName",

135 "options": "dataTransferredOut"

136 },

137 "properties": [

138 {

139 "id": "displayName",

140 "value": "Applications Out"

141 }

142 ]

143 },

144 {

145 "matcher": {

146 "id": "byName",

147 "options": "dataTransferredTotal"

148 },

149 "properties": [

150 {

151 "id": "displayName",

152 "value": "Applications"

153 }

154 ]

155 }

156 ]

157 },

158 "gridPos": {

159 "h": 8,

160 "w": 12,

161 "x": 0,

162 "y": 0

163 },

164 "id": 2,

165 "options": {

166 "legend": {

167 "calcs": [

168 "sum"

169 ],

170 "displayMode": "list",

171 "placement": "bottom",

172 "showLegend": true

173 },

174 "tooltip": {

175 "mode": "multi",

176 "sort": "none"

177 }

178 },

179 "targets": [

180 {

181 "aliasBy": "",

182 "annotationTags": "",

183 "annotationText": "",

184 "annotationTitle": "",

185 "dataPath": "httpMetrics",

186 "dataSourceSelect": {

187 "label": "Metrics",

188 "value": "metrics"

189 },

190 "datasource": {

191 "type": "fifemon-graphql-datasource",

192 "uid": "${DS_AZION}"

193 },

194 "endTimePath": "endTime",

195 "groupBy": "",

196 "optionsDataSource": [

197 {

198 "label": "Metrics",

199 "value": "metrics"

200 },

201 {

202 "label": "Events",

203 "value": "events"

204 }

205 ],

206

          "queryText": "query HttpCalculatedDataTransferred {\n  httpMetrics(\n    limit: 2000\n    filter: {\n      tsRange: { begin: \"${__from:date:iso}\", end: \"${__to:date:iso}\" },\n    }\n    groupBy:[ts]\n    orderBy:[ts_ASC]\n  )\n  {\n    ts\n    dataTransferredIn\n    dataTransferredOut\n    dataTransferredTotal\n  }\n}",

207 "refId": "A",

208 "timeFormat": "",

209 "timePath": "Time"

210 }

211 ],

212 "title": "Cache",

213 "type": "timeseries"

214 },

215 {

216 "datasource": {

217 "type": "fifemon-graphql-datasource",

218 "uid": "${DS_AZION}"

219 },

220 "fieldConfig": {

221 "defaults": {

222 "color": {

223 "mode": "palette-classic"

224 },

225 "custom": {

226 "axisCenteredZero": false,

227 "axisColorMode": "text",

228 "axisLabel": "",

229 "axisPlacement": "auto",

230 "barAlignment": 0,

231 "drawStyle": "line",

232 "fillOpacity": 0,

233 "gradientMode": "none",

234 "hideFrom": {

235 "legend": false,

236 "tooltip": false,

237 "viz": false

238 },

239 "lineInterpolation": "linear",

240 "lineWidth": 1,

241 "pointSize": 5,

242 "scaleDistribution": {

243 "type": "linear"

244 },

245 "showPoints": "auto",

246 "spanNulls": false,

247 "stacking": {

248 "group": "A",

249 "mode": "none"

250 },

251 "thresholdsStyle": {

252 "mode": "off"

253 }

254 },

255 "mappings": [],

256 "thresholds": {

257 "mode": "absolute",

258 "steps": [

259 {

260 "color": "green",

261 "value": null

262 },

263 {

264 "color": "red",

265 "value": 80

266 }

267 ]

268 },

269 "unit": "percent"

270 },

271 "overrides": [

272 {

273 "matcher": {

274 "id": "byName",

275 "options": "offload"

276 },

277 "properties": [

278 {

279 "id": "displayName",

280 "value": "Applications"

281 }

282 ]

283 }

284 ]

285 },

286 "gridPos": {

287 "h": 8,

288 "w": 12,

289 "x": 12,

290 "y": 0

291 },

292 "id": 4,

293 "options": {

294 "legend": {

295 "calcs": [

296 "mean"

297 ],

298 "displayMode": "list",

299 "placement": "bottom",

300 "showLegend": true

301 },

302 "tooltip": {

303 "mode": "single",

304 "sort": "none"

305 }

306 },

307 "targets": [

308 {

309 "aliasBy": "",

310 "annotationTags": "",

311 "annotationText": "",

312 "annotationTitle": "",

313 "dataPath": "httpMetrics",

314 "dataSourceSelect": {

315 "label": "Metrics",

316 "value": "metrics"

317 },

318 "datasource": {

319 "type": "fifemon-graphql-datasource",

320 "uid": "${DS_AZION}"

321 },

322 "endTimePath": "endTime",

323 "groupBy": "",

324 "optionsDataSource": [

325 {

326 "label": "Metrics",

327 "value": "metrics"

328 },

329 {

330 "label": "Events",

331 "value": "events"

332 }

333 ],

334

          "queryText": "query HttpCalculatedEdgeOffload {\n  httpMetrics(\n    limit: 1000, \n    filter: {\n      tsRange: { begin: \"${__from:date:iso}\", end: \"${__to:date:iso}\" },\n    },\n    groupBy: [ts]\n    orderBy: [ts_ASC]\n          ) \n  {        \n    ts\n    offload\n  }\n}",

335 "refId": "A",

336 "timeFormat": "",

337 "timePath": "Time"

338 }

339 ],

340 "title": "Edge Offload",

341 "type": "timeseries"

342 },

343 {

344 "datasource": {

345 "type": "fifemon-graphql-datasource",

346 "uid": "${DS_AZION}"

347 },

348 "fieldConfig": {

349 "defaults": {

350 "color": {

351 "mode": "palette-classic"

352 },

353 "custom": {

354 "axisCenteredZero": false,

355 "axisColorMode": "text",

356 "axisLabel": "",

357 "axisPlacement": "auto",

358 "barAlignment": 0,

359 "drawStyle": "line",

360 "fillOpacity": 0,

361 "gradientMode": "none",

362 "hideFrom": {

363 "legend": false,

364 "tooltip": false,

365 "viz": false

366 },

367 "lineInterpolation": "linear",

368 "lineWidth": 1,

369 "pointSize": 5,

370 "scaleDistribution": {

371 "type": "linear"

372 },

373 "showPoints": "auto",

374 "spanNulls": false,

375 "stacking": {

376 "group": "A",

377 "mode": "none"

378 },

379 "thresholdsStyle": {

380 "mode": "off"

381 }

382 },

383 "mappings": [],

384 "thresholds": {

385 "mode": "absolute",

386 "steps": [

387 {

388 "color": "green",

389 "value": null

390 },

391 {

392 "color": "red",

393 "value": 80

394 }

395 ]

396 },

397 "unit": "decbytes"

398 },

399 "overrides": [

400 {

401 "matcher": {

402 "id": "byName",

403 "options": "savedData"

404 },

405 "properties": [

406 {

407 "id": "displayName",

408 "value": "Applications"

409 }

410 ]

411 }

412 ]

413 },

414 "gridPos": {

415 "h": 8,

416 "w": 12,

417 "x": 0,

418 "y": 8

419 },

420 "id": 6,

421 "options": {

422 "legend": {

423 "calcs": [

424 "sum"

425 ],

426 "displayMode": "list",

427 "placement": "bottom",

428 "showLegend": true

429 },

430 "tooltip": {

431 "mode": "single",

432 "sort": "none"

433 }

434 },

435 "targets": [

436 {

437 "aliasBy": "",

438 "annotationTags": "",

439 "annotationText": "",

440 "annotationTitle": "",

441 "dataPath": "httpMetrics",

442 "dataSourceSelect": {

443 "label": "Metrics",

444 "value": "metrics"

445 },

446 "datasource": {

447 "type": "fifemon-graphql-datasource",

448 "uid": "${DS_AZION}"

449 },

450 "endTimePath": "endTime",

451 "groupBy": "",

452 "optionsDataSource": [

453 {

454 "label": "Metrics",

455 "value": "metrics"

456 },

457 {

458 "label": "Events",

459 "value": "events"

460 }

461 ],

462

          "queryText": "query HttpCalculatedSavedData { \n  httpMetrics( \n    limit: 1000,\n    filter: { \n      tsRange: { begin: \"${__from:date:iso}\", end: \"${__to:date:iso}\" }, \n    },\n    groupBy: [ts] \n    orderBy: [ts_ASC]\n  )\n   { \n     ts\n     savedData\n   } \n}",

463 "refId": "A",

464 "timeFormat": "",

465 "timePath": "Time"

466 }

467 ],

468 "title": "Saved Data",

469 "type": "timeseries"

470 },

471 {

472 "datasource": {

473 "type": "fifemon-graphql-datasource",

474 "uid": "${DS_AZION}"

475 },

476 "description": "",

477 "fieldConfig": {

478 "defaults": {

479 "color": {

480 "mode": "palette-classic"

481 },

482 "custom": {

483 "axisCenteredZero": false,

484 "axisColorMode": "text",

485 "axisLabel": "",

486 "axisPlacement": "auto",

487 "barAlignment": 0,

488 "drawStyle": "line",

489 "fillOpacity": 0,

490 "gradientMode": "none",

491 "hideFrom": {

492 "legend": false,

493 "tooltip": false,

494 "viz": false

495 },

496 "lineInterpolation": "linear",

497 "lineWidth": 1,

498 "pointSize": 5,

499 "scaleDistribution": {

500 "type": "linear"

501 },

502 "showPoints": "auto",

503 "spanNulls": false,

504 "stacking": {

505 "group": "A",

506 "mode": "none"

507 },

508 "thresholdsStyle": {

509 "mode": "off"

510 }

511 },

512 "mappings": [],

513 "thresholds": {

514 "mode": "absolute",

515 "steps": [

516 {

517 "color": "green",

518 "value": null

519 },

520 {

521 "color": "red",

522 "value": 80

523 }

524 ]

525 },

526 "unit": "decbytes"

527 },

528 "overrides": [

529 {

530 "matcher": {

531 "id": "byName",

532 "options": "missedData"

533 },

534 "properties": [

535 {

536 "id": "displayName",

537 "value": "Applications"

538 }

539 ]

540 }

541 ]

542 },

543 "gridPos": {

544 "h": 8,

545 "w": 12,

546 "x": 12,

547 "y": 8

548 },

549 "id": 8,

550 "options": {

551 "legend": {

552 "calcs": [

553 "sum"

554 ],

555 "displayMode": "list",

556 "placement": "bottom",

557 "showLegend": true

558 },

559 "tooltip": {

560 "mode": "single",

561 "sort": "none"

562 }

563 },

564 "targets": [

565 {

566 "aliasBy": "",

567 "annotationTags": "",

568 "annotationText": "",

569 "annotationTitle": "",

570 "dataPath": "httpMetrics",

571 "dataSourceSelect": {

572 "label": "Metrics",

573 "value": "metrics"

574 },

575 "datasource": {

576 "type": "fifemon-graphql-datasource",

577 "uid": "${DS_AZION}"

578 },

579 "endTimePath": "endTime",

580 "groupBy": "",

581 "optionsDataSource": [

582 {

583 "label": "Metrics",

584 "value": "metrics"

585 },

586 {

587 "label": "Events",

588 "value": "events"

589 }

590 ],

591

          "queryText": "query HttpCalculatedMissedData {\n  httpMetrics(\n    limit: 1000, \n    filter: {\n      tsRange: { begin: \"${__from:date:iso}\", end: \"${__to:date:iso}\" },\n    },\n    groupBy: [ts]\n    orderBy: [ts_ASC]\n          ) \n  {        \n    ts,\n    missedData\n  }\n}",

592 "refId": "A",

593 "timeFormat": "",

594 "timePath": "Time"

595 }

596 ],

597 "title": "Missed Data",

598 "type": "timeseries"

599 },

600 {

601 "datasource": {

602 "type": "fifemon-graphql-datasource",

603 "uid": "${DS_AZION}"

604 },

605 "fieldConfig": {

606 "defaults": {

607 "color": {

608 "mode": "palette-classic"

609 },

610 "custom": {

611 "axisCenteredZero": false,

612 "axisColorMode": "text",

613 "axisLabel": "",

614 "axisPlacement": "auto",

615 "barAlignment": 0,

616 "drawStyle": "line",

617 "fillOpacity": 0,

618 "gradientMode": "none",

619 "hideFrom": {

620 "legend": false,

621 "tooltip": false,

622 "viz": false

623 },

624 "lineInterpolation": "linear",

625 "lineWidth": 1,

626 "pointSize": 5,

627 "scaleDistribution": {

628 "type": "linear"

629 },

630 "showPoints": "auto",

631 "spanNulls": false,

632 "stacking": {

633 "group": "A",

634 "mode": "none"

635 },

636 "thresholdsStyle": {

637 "mode": "off"

638 }

639 },

640 "mappings": [],

641 "thresholds": {

642 "mode": "absolute",

643 "steps": [

644 {

645 "color": "green",

646 "value": null

647 },

648 {

649 "color": "red",

650 "value": 80

651 }

652 ]

653 },

654 "unit": "bps"

655 },

656 "overrides": [

657 {

658 "matcher": {

659 "id": "byName",

660 "options": "bandwidthTotal"

661 },

662 "properties": [

663 {

664 "id": "displayName",

665 "value": "Applications"

666 }

667 ]

668 }

669 ]

670 },

671 "gridPos": {

672 "h": 8,

673 "w": 12,

674 "x": 0,

675 "y": 16

676 },

677 "id": 10,

678 "options": {

679 "legend": {

680 "calcs": [

681 "mean"

682 ],

683 "displayMode": "list",

684 "placement": "bottom",

685 "showLegend": true

686 },

687 "tooltip": {

688 "mode": "single",

689 "sort": "none"

690 }

691 },

692 "targets": [

693 {

694 "aliasBy": "",

695 "annotationTags": "",

696 "annotationText": "",

697 "annotationTitle": "",

698 "dataPath": "httpMetrics",

699 "dataSourceSelect": {

700 "label": "Metrics",

701 "value": "metrics"

702 },

703 "datasource": {

704 "type": "fifemon-graphql-datasource",

705 "uid": "${DS_AZION}"

706 },

707 "endTimePath": "endTime",

708 "groupBy": "",

709 "optionsDataSource": [

710 {

711 "label": "Metrics",

712 "value": "metrics"

713 },

714 {

715 "label": "Events",

716 "value": "events"

717 }

718 ],

719

          "queryText": "query HttpCalculatedBandwidthTotalData {\n  httpMetrics(\n    limit: 1000, \n    filter: {\n      tsRange: { begin: \"${__from:date:iso}\", end: \"${__to:date:iso}\" },\n    },\n    groupBy: [ts]\n    orderBy: [ts_ASC]\n          ) \n  {        \n    ts,\n    bandwidthTotal\n  }\n}",

720 "refId": "A",

721 "timeFormat": "",

722 "timePath": "Time"

723 }

724 ],

725 "title": "Total Bandwidth Usage",

726 "type": "timeseries"

727 },

728 {

729 "datasource": {

730 "type": "fifemon-graphql-datasource",

731 "uid": "${DS_AZION}"

732 },

733 "fieldConfig": {

734 "defaults": {

735 "color": {

736 "mode": "palette-classic"

737 },

738 "custom": {

739 "axisCenteredZero": false,

740 "axisColorMode": "text",

741 "axisLabel": "",

742 "axisPlacement": "auto",

743 "barAlignment": 0,

744 "drawStyle": "line",

745 "fillOpacity": 0,

746 "gradientMode": "none",

747 "hideFrom": {

748 "legend": false,

749 "tooltip": false,

750 "viz": false

751 },

752 "lineInterpolation": "linear",

753 "lineWidth": 1,

754 "pointSize": 5,

755 "scaleDistribution": {

756 "type": "linear"

757 },

758 "showPoints": "auto",

759 "spanNulls": false,

760 "stacking": {

761 "group": "A",

762 "mode": "none"

763 },

764 "thresholdsStyle": {

765 "mode": "off"

766 }

767 },

768 "mappings": [],

769 "thresholds": {

770 "mode": "absolute",

771 "steps": [

772 {

773 "color": "green",

774 "value": null

775 },

776 {

777 "color": "red",

778 "value": 80

779 }

780 ]

781 },

782 "unit": "percent"

783 },

784 "overrides": [

785 {

786 "matcher": {

787 "id": "byName",

788 "options": "bandwidthOffload"

789 },

790 "properties": [

791 {

792 "id": "displayName",

793 "value": "Applications"

794 }

795 ]

796 }

797 ]

798 },

799 "gridPos": {

800 "h": 8,

801 "w": 12,

802 "x": 12,

803 "y": 16

804 },

805 "id": 12,

806 "options": {

807 "legend": {

808 "calcs": [

809 "mean"

810 ],

811 "displayMode": "list",

812 "placement": "bottom",

813 "showLegend": true

814 },

815 "tooltip": {

816 "mode": "single",

817 "sort": "none"

818 }

819 },

820 "targets": [

821 {

822 "aliasBy": "",

823 "annotationTags": "",

824 "annotationText": "",

825 "annotationTitle": "",

826 "dataPath": "httpMetrics",

827 "dataSourceSelect": {

828 "label": "Metrics",

829 "value": "metrics"

830 },

831 "datasource": {

832 "type": "fifemon-graphql-datasource",

833 "uid": "${DS_AZION}"

834 },

835 "endTimePath": "endTime",

836 "groupBy": "",

837 "optionsDataSource": [

838 {

839 "label": "Metrics",

840 "value": "metrics"

841 },

842 {

843 "label": "Events",

844 "value": "events"

845 }

846 ],

847

          "queryText": "query HttpCalculatedBandwidthOffload {\n  httpMetrics(\n    limit: 1000, \n    filter: {\n      tsRange: { begin: \"${__from:date:iso}\", end: \"${__to:date:iso}\" },\n    },\n    groupBy: [ts]\n    orderBy: [ts_ASC]\n          ) \n  {        \n    ts,\n    bandwidthOffload\n  }\n}",

848 "refId": "A",

849 "timeFormat": "",

850 "timePath": "Time"

851 }

852 ],

853 "title": "Bandwidth Offloaded",

854 "type": "timeseries"

855 },

856 {

857 "datasource": {

858 "type": "fifemon-graphql-datasource",

859 "uid": "${DS_AZION}"

860 },

861 "fieldConfig": {

862 "defaults": {

863 "color": {

864 "mode": "palette-classic"

865 },

866 "custom": {

867 "axisCenteredZero": false,

868 "axisColorMode": "text",

869 "axisLabel": "",

870 "axisPlacement": "auto",

871 "barAlignment": 0,

872 "drawStyle": "line",

873 "fillOpacity": 0,

874 "gradientMode": "none",

875 "hideFrom": {

876 "legend": false,

877 "tooltip": false,

878 "viz": false

879 },

880 "lineInterpolation": "linear",

881 "lineWidth": 1,

882 "pointSize": 5,

883 "scaleDistribution": {

884 "type": "linear"

885 },

886 "showPoints": "auto",

887 "spanNulls": false,

888 "stacking": {

889 "group": "A",

890 "mode": "none"

891 },

892 "thresholdsStyle": {

893 "mode": "off"

894 }

895 },

896 "mappings": [],

897 "thresholds": {

898 "mode": "absolute",

899 "steps": [

900 {

901 "color": "green",

902 "value": null

903 },

904 {

905 "color": "red",

906 "value": 80

907 }

908 ]

909 },

910 "unit": "bps"

911 },

912 "overrides": [

913 {

914 "matcher": {

915 "id": "byName",

916 "options": "bandwidthSavedData"

917 },

918 "properties": [

919 {

920 "id": "displayName",

921 "value": "Applications"

922 }

923 ]

924 }

925 ]

926 },

927 "gridPos": {

928 "h": 8,

929 "w": 12,

930 "x": 0,

931 "y": 24

932 },

933 "id": 14,

934 "options": {

935 "legend": {

936 "calcs": [

937 "mean"

938 ],

939 "displayMode": "list",

940 "placement": "bottom",

941 "showLegend": true

942 },

943 "tooltip": {

944 "mode": "single",

945 "sort": "none"

946 }

947 },

948 "targets": [

949 {

950 "aliasBy": "",

951 "annotationTags": "",

952 "annotationText": "",

953 "annotationTitle": "",

954 "dataPath": "httpMetrics",

955 "dataSourceSelect": {

956 "label": "Metrics",

957 "value": "metrics"

958 },

959 "datasource": {

960 "type": "fifemon-graphql-datasource",

961 "uid": "${DS_AZION}"

962 },

963 "endTimePath": "endTime",

964 "groupBy": "",

965 "optionsDataSource": [

966 {

967 "label": "Metrics",

968 "value": "metrics"

969 },

970 {

971 "label": "Events",

972 "value": "events"

973 }

974 ],

975

          "queryText": "query HttpCalculatedBandwidthSavedlData {\n  httpMetrics(\n    limit: 1000, \n    filter: {\n      tsRange: { begin: \"${__from:date:iso}\", end: \"${__to:date:iso}\" },\n    },\n    groupBy: [ts]\n    orderBy: [ts_ASC]\n          ) \n  {        \n    ts,\n    bandwidthSavedData\n  }\n}",

976 "refId": "A",

977 "timeFormat": "",

978 "timePath": "Time"

979 }

980 ],

981 "title": "Saved Bandwidth",

982 "type": "timeseries"

983 },

984 {

985 "datasource": {

986 "type": "fifemon-graphql-datasource",

987 "uid": "${DS_AZION}"

988 },

989 "fieldConfig": {

990 "defaults": {

991 "color": {

992 "mode": "palette-classic"

993 },

994 "custom": {

995 "axisCenteredZero": false,

996 "axisColorMode": "text",

997 "axisLabel": "",

998 "axisPlacement": "auto",

999 "barAlignment": 0,

1000 "drawStyle": "line",

1001 "fillOpacity": 0,

1002 "gradientMode": "none",

1003 "hideFrom": {

1004 "legend": false,

1005 "tooltip": false,

1006 "viz": false

1007 },

1008 "lineInterpolation": "linear",

1009 "lineWidth": 1,

1010 "pointSize": 5,

1011 "scaleDistribution": {

1012 "type": "linear"

1013 },

1014 "showPoints": "auto",

1015 "spanNulls": false,

1016 "stacking": {

1017 "group": "A",

1018 "mode": "none"

1019 },

1020 "thresholdsStyle": {

1021 "mode": "off"

1022 }

1023 },

1024 "mappings": [],

1025 "thresholds": {

1026 "mode": "absolute",

1027 "steps": [

1028 {

1029 "color": "green",

1030 "value": null

1031 },

1032 {

1033 "color": "red",

1034 "value": 80

1035 }

1036 ]

1037 },

1038 "unit": "bps"

1039 },

1040 "overrides": [

1041 {

1042 "matcher": {

1043 "id": "byName",

1044 "options": "bandwidthMissedData"

1045 },

1046 "properties": [

1047 {

1048 "id": "displayName",

1049 "value": "Applications"

1050 }

1051 ]

1052 }

1053 ]

1054 },

1055 "gridPos": {

1056 "h": 8,

1057 "w": 12,

1058 "x": 12,

1059 "y": 24

1060 },

1061 "id": 16,

1062 "options": {

1063 "legend": {

1064 "calcs": [

1065 "mean"

1066 ],

1067 "displayMode": "list",

1068 "placement": "bottom",

1069 "showLegend": true

1070 },

1071 "tooltip": {

1072 "mode": "single",

1073 "sort": "none"

1074 }

1075 },

1076 "targets": [

1077 {

1078 "aliasBy": "",

1079 "annotationTags": "",

1080 "annotationText": "",

1081 "annotationTitle": "",

1082 "dataPath": "httpMetrics",

1083 "dataSourceSelect": {

1084 "label": "Metrics",

1085 "value": "metrics"

1086 },

1087 "datasource": {

1088 "type": "fifemon-graphql-datasource",

1089 "uid": "${DS_AZION}"

1090 },

1091 "endTimePath": "endTime",

1092 "groupBy": "",

1093 "optionsDataSource": [

1094 {

1095 "label": "Metrics",

1096 "value": "metrics"

1097 },

1098 {

1099 "label": "Events",

1100 "value": "events"

1101 }

1102 ],

1103

          "queryText": "query HttpCalculatedBandwidthMissedlData {\n  httpMetrics(\n    limit: 1000, \n    filter: {\n      tsRange: { begin: \"${__from:date:iso}\", end: \"${__to:date:iso}\" },\n    },\n    groupBy: [ts]\n    orderBy: [ts_ASC]\n          ) \n  {        \n    ts,\n    bandwidthMissedData\n  }\n}",

1104 "refId": "A",

1105 "timeFormat": "",

1106 "timePath": "Time"

1107 }

1108 ],

1109 "title": "Missed Bandwidth",

1110 "type": "timeseries"

1111 }

1112 ],

1113 "refresh": "30s",

1114 "schemaVersion": 37,

1115 "style": "dark",

1116 "tags": [

1117 "Azion",

1118 "Applications",

1119 "Data Transferred "

1120 ],

1121 "templating": {

1122 "list": []

1123 },

1124 "time": {

1125 "from": "now-7d",

1126 "to": "now"

1127 },

1128 "timepicker": {},

1129 "timezone": "",

1130 "title": "Data Transferred",

1131 "uid": "gjxbR-a4z",

1132 "version": 6,

1133 "weekStart": ""

1134}

Verifique os painéis

Cada painel envia uma query ao dataset httpMetrics e desenha as linhas que estão sob httpMetrics na resposta, o dataPath do painel. Antes de enviar uma query, o Grafana substitui ${__from:date:iso} e ${__to:date:iso} pelo intervalo de tempo do dashboard. Os painéis, na ordem do dashboard:

Painel	Query	Campos	Unidade no Grafana
Cache	`HttpCalculatedDataTransferred`	`dataTransferredIn`, `dataTransferredOut`, `dataTransferredTotal`	`decbytes`
Edge Offload	`HttpCalculatedEdgeOffload`	`offload`	`percent`
Saved Data	`HttpCalculatedSavedData`	`savedData`	`decbytes`
Missed Data	`HttpCalculatedMissedData`	`missedData`	`decbytes`
Total Bandwidth Usage	`HttpCalculatedBandwidthTotalData`	`bandwidthTotal`	`bps`
Bandwidth Offloaded	`HttpCalculatedBandwidthOffload`	`bandwidthOffload`	`percent`
Saved Bandwidth	`HttpCalculatedBandwidthSavedlData`	`bandwidthSavedData`	`bps`
Missed Bandwidth	`HttpCalculatedBandwidthMissedlData`	`bandwidthMissedData`	`bps`

Todas as queries agrupam por ts e ordenam por ts_ASC, então cada linha é um bucket de tempo, do mais antigo para o mais recente. A query do painel Cache define limit: 2000 e as outras sete definem limit: 1000. O tamanho do bucket segue a duração do intervalo: no intervalo padrão de 7 dias, cada linha cobre uma hora. Para a regra completa, consulte Como funciona.

Para um intervalo de 24 horas, o painel Cache envia esta query:

GraphQL

01query HttpCalculatedDataTransferred {

02 httpMetrics(

03 limit: 2000

04 filter: {

05 tsRange: { begin: "2026-10-01T14:25:25.000Z", end: "2026-10-02T14:25:25.000Z" },

06 }

07 groupBy:[ts]

08 orderBy:[ts_ASC]

09 )

10 {

11 ts

12 dataTransferredIn

13 dataTransferredOut

14 dataTransferredTotal

15 }

16}

A API retorna HTTP 200 com uma linha por minuto que teve tráfego:

JSON

01{

02 "data": {

03 "httpMetrics": [

04 {

05 "ts": "2026-10-01T16:04:00Z",

06 "dataTransferredIn": 13094.0,

07 "dataTransferredOut": 2649889.0,

08 "dataTransferredTotal": 2662983.0

09 },

10 {

11 "ts": "2026-10-01T16:06:00Z",

12 "dataTransferredIn": 7470.0,

13 "dataTransferredOut": 986551.0,

14 "dataTransferredTotal": 994021.0

15 },

16 {

17 "ts": "2026-10-01T16:07:00Z",

18 "dataTransferredIn": 28443.0,

19 "dataTransferredOut": 2109827.0,

20 "dataTransferredTotal": 2138270.0

21 },

22 …

23 ]

24 }

25}

Quando um painel não desenha nenhuma linha no gráfico, a resposta à query dele indica a causa:

Um array httpMetrics vazio: suas aplicações não tiveram tráfego no intervalo selecionado.
HTTP 401 com {"detail": "Authentication credentials were not provided."}: o data source não envia o header Authorization.
HTTP 403 com uma página de erro em HTML: o data source aponta para o host legado https://api.azionapi.net/metrics/graphql.

Para saber o que cada campo mede, consulte Dashboards de Build, em que o painel Cache corresponde ao gráfico Edge Cache.

Próximos passos

Importe o dashboard Real-Time MetricsAdicione um segundo dashboard com requisições, status codes, métodos HTTP e os principais request URIs e hosts.Instale o plugin da Azion para GrafanaConsulte o Real-Time Metrics pelo plugin de data source da Azion em vez de um data source GraphQL genérico.Dashboards de BuildLeia o que cada gráfico de Data Transferred mede e o caminho dos dados que ele conta.Campos do Real-Time MetricsConsulte o tipo de cada campo de httpMetrics que os painéis usam.