github-mirrors/kibana
1
0
Fork 0
mirror of https://github.com/elastic/kibana.git synced 2025-04-23 17:28:26 -04:00
Code Issues Projects Releases Packages Wiki Activity

[6.x][Uptime] Remove broken stacked chart in monitor detail page. (#29189)

Browse source 
This chart had no legend and the stacking displayed the wrong values. We need to redo this one more carefully. We can bring this back later in a form that actually functions.
This commit is contained in:
Andrew Cholakian 2019-01-24 11:19:09 -08:00 • committed by GitHub
parent 47b8eb4df4
commit 79b12174e9
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 43 additions and 113 deletions
Download patch file Download diff file Expand all files Collapse all files

156
x-pack/plugins/uptime/public/components/queries/monitor_charts/monitor_charts.tsx
View file

@ -124,80 +124,9 @@ export class MonitorCharts extends React.Component<Props, MonitorChartsState> {
const durationDomain = avgDurationSeries.concat(areaRttSeries);
const durationLimits = [0, Math.max(...durationDomain.map(({ y }) => y))];
// find the greatest y-value for rtt chart
const rttLimits = [0, Math.max(...maxRtt.map(({ y }) => y))];
return (
<Fragment>
<EuiFlexGroup>
<EuiFlexItem>
<EuiTitle size="xs">
<h4>
<FormattedMessage
id="xpack.uptime.monitorCharts.rttBreakdownTitle"
defaultMessage="RTT Breakdown ms"
description="The 'ms' is an abbreviation for milliseconds."
/>
</h4>
</EuiTitle>
<EuiPanel>
<EuiSeriesChart
stackBy="y"
margins={{ left: 60, right: 40, top: 10, bottom: 40 }}
xType={EuiSeriesChartUtils.SCALE.TIME}
yDomain={rttLimits}
width={500}
height={200}
crosshairValue={this.state.crosshairLocation}
onCrosshairUpdate={this.updateCrosshairLocation}
>
<EuiAreaSeries
name={i18n.translate(
'xpack.uptime.monitorCharts.rtt.series.writeRequestLabel',
{
defaultMessage: 'Write request',
}
)}
data={rttWriteRequestSeries}
curve="curveBasis"
/>
<EuiAreaSeries
name={i18n.translate(
'xpack.uptime.monitorCharts.rtt.series.validateLabel',
{
defaultMessage: 'Validate',
}
)}
data={rttValidateSeries}
curve="curveBasis"
/>
<EuiAreaSeries
name={i18n.translate('xpack.uptime.monitorCharts.rtt.series.contentLabel', {
defaultMessage: 'Content',
})}
data={rttContentSeries}
curve="curveBasis"
/>
<EuiAreaSeries
name={i18n.translate(
'xpack.uptime.monitorCharts.rtt.series.responseLabel',
{
defaultMessage: 'Response',
}
)}
data={rttResponseSeries}
curve="curveBasis"
/>
<EuiAreaSeries
name={i18n.translate('xpack.uptime.monitorCharts.rtt.series.tcpLabel', {
defaultMessage: 'Tcp',
})}
data={rttTcpSeries}
curve="curveBasis"
/>
</EuiSeriesChart>
</EuiPanel>
</EuiFlexItem>
<EuiFlexItem>
<EuiTitle size="xs">
<h4>
@ -241,49 +170,50 @@ export class MonitorCharts extends React.Component<Props, MonitorChartsState> {
</EuiSeriesChart>
</EuiPanel>
</EuiFlexItem>
<EuiFlexItem>
<EuiTitle size="xs">
<h4>
<FormattedMessage
id="xpack.uptime.monitorCharts.checkStatus.title"
defaultMessage="Check status"
/>
</h4>
</EuiTitle>
<EuiPanel style={{ maxWidth: 520, maxHeight: 220 }}>
<EuiSeriesChart
margins={{ left: 60, right: 40, top: 10, bottom: 40 }}
width={500}
height={200}
xType={EuiSeriesChartUtils.SCALE.TIME}
stackBy="y"
crosshairValue={this.state.crosshairLocation}
onCrosshairUpdate={this.updateCrosshairLocation}
yDomain={domainLimits}
>
<EuiAreaSeries
name={i18n.translate(
'xpack.uptime.monitorCharts.checkStatus.series.upCountLabel',
{
defaultMessage: 'Up count',
}
)}
data={upSeries}
color="green"
/>
<EuiAreaSeries
name={i18n.translate(
'xpack.uptime.monitorCharts.checkStatus.series.downCountLabel',
{
defaultMessage: 'Down count',
}
)}
data={downSeries}
color="red"
/>
</EuiSeriesChart>
</EuiPanel>
</EuiFlexItem>
</EuiFlexGroup>
<EuiSpacer />
<EuiTitle size="xs">
<h4>
<FormattedMessage
id="xpack.uptime.monitorCharts.checkStatus.title"
defaultMessage="Check status"
/>
</h4>
</EuiTitle>
<EuiPanel style={{ maxWidth: 520, maxHeight: 220 }}>
<EuiSeriesChart
margins={{ left: 60, right: 40, top: 10, bottom: 40 }}
width={500}
height={200}
xType={EuiSeriesChartUtils.SCALE.TIME}
stackBy="y"
crosshairValue={this.state.crosshairLocation}
onCrosshairUpdate={this.updateCrosshairLocation}
yDomain={domainLimits}
>
<EuiAreaSeries
name={i18n.translate(
'xpack.uptime.monitorCharts.checkStatus.series.upCountLabel',
{
defaultMessage: 'Up count',
}
)}
data={upSeries}
color="green"
/>
<EuiAreaSeries
name={i18n.translate(
'xpack.uptime.monitorCharts.checkStatus.series.downCountLabel',
{
defaultMessage: 'Down count',
}
)}
data={downSeries}
color="red"
/>
</EuiSeriesChart>
</EuiPanel>
</Fragment>
);
}}