mirror of
https://github.com/apache/impala.git
synced 2025-12-19 09:58:28 -05:00
IMPALA-12037: Update Chart.js to 2.9.4
Updates Chart.js to 2.9.4 for bug fixes and to avoid prototype pollution. Added Chart.min.js from https://github.com/chartjs/Chart.js/releases/tag/v2.9.4. Moment.js from bundle does not seem to be needed. Chart.js 2.8 introduced https://github.com/chartjs/Chart.js/issues/6154, which causes the last X-axis label with "and above" to always be omitted. Add a custom autofit function to calculate our own spacing. Testing: - Examined /admission page with multiple queries admitted. Graph appears to render correctly. Change-Id: Ia4e0da58755b9561ddc75c217ef227a81c80a2a6 Reviewed-on: http://gerrit.cloudera.org:8080/19683 Reviewed-by: Impala Public Jenkins <impala-public-jenkins@cloudera.com> Tested-by: Impala Public Jenkins <impala-public-jenkins@cloudera.com>
This commit is contained in:
committed by
Impala Public Jenkins
parent
ac23deab4d
commit
73a33d93d9
10
www/Chart-2.7.3.min.js
vendored
10
www/Chart-2.7.3.min.js
vendored
File diff suppressed because one or more lines are too long
7
www/Chart-2.9.4.min.js
vendored
Executable file
7
www/Chart-2.9.4.min.js
vendored
Executable file
File diff suppressed because one or more lines are too long
@@ -99,13 +99,45 @@ Example of json received from the impala server
|
|||||||
<strong>{{statestore_update_staleness_detail}}</strong>
|
<strong>{{statestore_update_staleness_detail}}</strong>
|
||||||
</div>
|
</div>
|
||||||
{{/statestore_update_staleness_detail}}
|
{{/statestore_update_staleness_detail}}
|
||||||
<script src='{{ __common__.host-url }}/www/Chart-2.7.3.min.js'></script>
|
<script src='{{ __common__.host-url }}/www/Chart-2.9.4.min.js'></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
window.onload = function() {
|
window.onload = function() {
|
||||||
renderGraph();
|
renderGraph();
|
||||||
formatMemoryColumns();
|
formatMemoryColumns();
|
||||||
};
|
};
|
||||||
|
|
||||||
|
// Workaround for https://github.com/chartjs/Chart.js/issues/6154, where the last X-axis
|
||||||
|
// label is always omitted. This function bakes in a lot of assumptions for our chart.
|
||||||
|
function afterFit(axis) {
|
||||||
|
const ticks = axis.getTicks();
|
||||||
|
const widest = axis._labelSizes.widest.width;
|
||||||
|
const chartWidth = axis.width;
|
||||||
|
|
||||||
|
// Apply a rough heuristic for rotation.
|
||||||
|
const maxFit = Math.trunc(3 * chartWidth / (2 * widest));
|
||||||
|
// Limit to 20 labels.
|
||||||
|
const willFit = Math.min(maxFit, 20);
|
||||||
|
|
||||||
|
// Ensure first and last are always shown.
|
||||||
|
const validLabelIndices = new Set();
|
||||||
|
validLabelIndices.add(0);
|
||||||
|
validLabelIndices.add(ticks.length - 1);
|
||||||
|
|
||||||
|
const numLabels = ticks.length % 2 === 0 ? willFit : willFit - 1;
|
||||||
|
|
||||||
|
const interval = ticks.length / (numLabels - 1);
|
||||||
|
for (let i = 1; i < willFit - 1; i += 1) {
|
||||||
|
validLabelIndices.add(Math.floor(interval * i));
|
||||||
|
}
|
||||||
|
|
||||||
|
ticks.forEach((tick, index) => {
|
||||||
|
Object.assign(
|
||||||
|
tick,
|
||||||
|
{ label: validLabelIndices.has(index) ? tick.label : null },
|
||||||
|
);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
// Picks up all the canvas elements associated with each resource pool and renders its
|
// Picks up all the canvas elements associated with each resource pool and renders its
|
||||||
// peak memory usage histogram.
|
// peak memory usage histogram.
|
||||||
function renderGraph() {
|
function renderGraph() {
|
||||||
@@ -147,6 +179,14 @@ function renderGraph() {
|
|||||||
title: {
|
title: {
|
||||||
display: true,
|
display: true,
|
||||||
text: 'Peak Memory per Host'
|
text: 'Peak Memory per Host'
|
||||||
|
},
|
||||||
|
scales: {
|
||||||
|
xAxes: [{
|
||||||
|
afterFit: afterFit,
|
||||||
|
ticks: {
|
||||||
|
autoSkip: false
|
||||||
|
}
|
||||||
|
}]
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|||||||
Reference in New Issue
Block a user