템플릿 변수를 활용한 임베드 그래프
API로 만든 임베드(embed) 그래프는 템플릿 변수를 지원해요. 아래는 Python을 이용해 avg:system.cpu.user{$var}을 쿼리하는 예시예요. 이 예시에서 $var가 바로 템플릿 변수랍니다. 참고: 이 방식은 timeseries 시각화만 지원해요.
출처: 문서
본문
API로 생성된 임베드 그래프는 템플릿 변수를 받을 수 있어요. 아래는 Python으로 avg:system.cpu.user{$var}를 쿼리하는 예시인데요, 여기서 $var가 템플릿 변수예요. 참고: 이 방식은 timeseries 시각화만 지원한다는 점을 기억해 주세요.
from datadog import initialize, api
import json
# Initialize request parameters with Datadog API/APP key
options = {
'api_key': '<DATADOG_API_KEY>',
'app_key': '<DATADOG_APPLICATION_KEY>'
}
initialize(**options)
# Create an embed graph definition as a dict and format as JSON
graph_json = {
"requests": [{
"q": "avg:system.cpu.user{$var}"
}],
"viz": "timeseries",
"events": []
}
graph_json = json.dumps(graph_json)
api.Embed.create(
graph_json=graph_json,
timeframe="1_hour",
size="medium",
legend="no"
)
응답 예시:
{
'embed_id': '<EMBED_ID>',
'revoked': False,
'template_variables': ['var'],
'html': '<iframe src="https://app.datadoghq.com/graph/embed?token=<EMBED_TOKEN>&height=300&width=600&legend=false&var=*" width="600" height="300" frameBorder="0"></iframe>',
'graph_title': 'Embed created through API',
'dash_url': None,
'shared_by': 734258,
'dash_name': None
}
응답 객체의 HTML을 사용해 임베드 그래프를 웹사이트에 표시할 수 있어요. iframe URL에서 $var 템플릿 변수가 기본적으로 *로 설정된 것을 확인할 수 있는데요, 이는 쿼리 avg:system.cpu.user{*}와 동일해요.
<iframe src="https://app.datadoghq.com/graph/embed?token=<EMBED_TOKEN>&height=300&width=600&legend=false&var=*" width="600" height="300" frameBorder="0"></iframe>
임베드 예시:
{% image source="https://docs.dd-static.net/images/dashboards/guide/embeddable_graph01.b6619e8f6ae575582bce264b87475932.png?auto=format&fit=max&w=850 1x, https://docs.dd-static.net/images/dashboards/guide/embeddable_graph01.b6619e8f6ae575582bce264b87475932.png?auto=format&fit=max&w=850&dpr=2 2x" alt="Embed Graph with No Filter" /%}
템플릿 변수를 사용해 iframe URL을 업데이트해서 필터를 정의하면 그래프를 바꿀 수 있어요. 아래 HTML에서는 *를 host:embed-graph-test로 바꿨어요.
<iframe src="https://app.datadoghq.com/graph/embed?token=<EMBED_TOKEN>&height=300&width=600&legend=false&var=host:embed-graph-test" width="600" height="300" frameBorder="0"></iframe>
임베드 예시:
{% image source="https://docs.dd-static.net/images/dashboards/guide/embeddable_graph02.011f7cac839b02f342622d38be3d248c.png?auto=format&fit=max&w=850 1x, https://docs.dd-static.net/images/dashboards/guide/embeddable_graph02.011f7cac839b02f342622d38be3d248c.png?auto=format&fit=max&w=850&dpr=2 2x" alt="Embed Graph with Filter" /%}
더 알아보기 (Learn more)
도움이 되는 추가 문서, 링크, 아티클이에요: