diff --git a/examples/example_dashboards.yaml b/examples/example_dashboards.yaml index ead9cd1..de5520e 100644 --- a/examples/example_dashboards.yaml +++ b/examples/example_dashboards.yaml @@ -5,7 +5,7 @@ query_type: Range # The type of graph. Range for timeseries and Scalar for point in time d3_tickformat: "~s" # Default tick format for the graph y axis legend_orientation: h - yaxes: + yaxes: # The yaxes definitions to feed to plotly. - anchor: "y" # overlaying: "y" side: left diff --git a/static/lib.js b/static/lib.js index 3fa05ad..d16ea49 100644 --- a/static/lib.js +++ b/static/lib.js @@ -195,7 +195,7 @@ export class GraphPlot extends HTMLElement { self.stopInterval() self.fetchData().then((data) => { if (!updateOnly) { - self.getLabelsForData(data.Metrics || data.Logs.Lines); + self.getLabelsForData(data.Metrics || data.Logs.lines); self.buildFilterMenu(); } self.updateGraph(data).then(() => { @@ -365,6 +365,32 @@ export class GraphPlot extends HTMLElement { * @param {QueryData|LogLineList} graph */ getLabelsForData(graph) { + if (/** @type {QueryData} */(graph).plots) { + this.getLabelsForQueryData(/** @type {QueryData} */(graph)); + } else { + this.getLabelsForLogLines(/** @type {LogLineList} */(graph)); + } + } + + /** + * @param {LogLineList} graph + */ + getLabelsForLogLines(graph) { + if (graph.Stream) { + for (const pair of graph.Stream) { + const labels = pair[0]; + this.populateFilterData(labels); + } + } + if (graph.StreamInstant) { + // TODO(zaphar): Handle this? + } + } + + /** + * @param {QueryData} graph + */ + getLabelsForQueryData(graph) { const data = graph.plots; for (var subplot of data) { if (subplot.Series) { @@ -379,15 +405,6 @@ export class GraphPlot extends HTMLElement { this.populateFilterData(labels); } } - if (subplot.Stream) { - for (const pair of subplot.Stream) { - const labels = pair[0]; - this.populateFilterData(labels); - } - } - if (subplot.StreamInstant) { - // TODO(zaphar): Handle this? - } } }