displaying batch lots as tooltips in scatter chart
This commit is contained in:
@@ -13870,6 +13870,7 @@
|
|||||||
<script src="../gentelella/vendors/bootstrap/dist/js/bootstrap.min.js"></script>
|
<script src="../gentelella/vendors/bootstrap/dist/js/bootstrap.min.js"></script>
|
||||||
<link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />
|
<link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />
|
||||||
<script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>
|
<script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>
|
||||||
|
<!-- FK-TODO: update chart.js to newest version -->
|
||||||
<script src="https://cdn.jsdelivr.net/npm/chart.js@4.2.0/dist/chart.umd.min.js"></script>
|
<script src="https://cdn.jsdelivr.net/npm/chart.js@4.2.0/dist/chart.umd.min.js"></script>
|
||||||
<script charset="utf8" src="https://cdn.datatables.net/1.13.1/js/jquery.dataTables.min.js"
|
<script charset="utf8" src="https://cdn.datatables.net/1.13.1/js/jquery.dataTables.min.js"
|
||||||
type="text/javascript"></script>
|
type="text/javascript"></script>
|
||||||
|
|||||||
@@ -16,14 +16,16 @@ class SymptomVsSymptomChartDataProvider {
|
|||||||
dict1: prrByLotX,
|
dict1: prrByLotX,
|
||||||
dict2: prrByLotY
|
dict2: prrByLotY
|
||||||
});
|
});
|
||||||
return Object
|
const lots = Object.keys(prrByLotXCommon);
|
||||||
.keys(prrByLotXCommon)
|
return {
|
||||||
.map(
|
labels: lots,
|
||||||
lot =>
|
data:
|
||||||
({
|
lots.map(
|
||||||
x: prrByLotXCommon[lot],
|
lot => ({
|
||||||
y: prrByLotYCommon[lot]
|
x: prrByLotXCommon[lot],
|
||||||
}));
|
y: prrByLotYCommon[lot]
|
||||||
|
}))
|
||||||
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
static #getCommonKeys(dict1, dict2) {
|
static #getCommonKeys(dict1, dict2) {
|
||||||
|
|||||||
@@ -7,6 +7,7 @@ class SymptomVsSymptomChartView {
|
|||||||
this.#canvas = canvas;
|
this.#canvas = canvas;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// FK-TODO: refactor
|
||||||
displayChart(symptomX, symptomY) {
|
displayChart(symptomX, symptomY) {
|
||||||
if (this.#chart != null) {
|
if (this.#chart != null) {
|
||||||
this.#chart.destroy();
|
this.#chart.destroy();
|
||||||
@@ -21,8 +22,8 @@ class SymptomVsSymptomChartView {
|
|||||||
const chartData = SymptomVsSymptomChartDataProvider.getChartData({ prrByLotX, prrByLotY });
|
const chartData = SymptomVsSymptomChartDataProvider.getChartData({ prrByLotX, prrByLotY });
|
||||||
const data = {
|
const data = {
|
||||||
datasets: [{
|
datasets: [{
|
||||||
label: 'Scatter Dataset',
|
labels: chartData.labels,
|
||||||
data: chartData,
|
data: chartData.data,
|
||||||
backgroundColor: 'rgb(0, 0, 255)'
|
backgroundColor: 'rgb(0, 0, 255)'
|
||||||
}],
|
}],
|
||||||
};
|
};
|
||||||
@@ -35,6 +36,18 @@ class SymptomVsSymptomChartView {
|
|||||||
type: 'linear',
|
type: 'linear',
|
||||||
position: 'bottom'
|
position: 'bottom'
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
plugins: {
|
||||||
|
legend: {
|
||||||
|
display: false
|
||||||
|
},
|
||||||
|
tooltip: {
|
||||||
|
callbacks: {
|
||||||
|
label: function (context) {
|
||||||
|
return 'Batch: ' + context.dataset.labels[context.dataIndex];
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -67,11 +67,14 @@ QUnit.module('SymptomVsSymptomChartDataProviderTest', function () {
|
|||||||
// Then
|
// Then
|
||||||
assert.deepEqual(
|
assert.deepEqual(
|
||||||
chartData,
|
chartData,
|
||||||
[
|
{
|
||||||
{
|
labels: ["lotCommon"],
|
||||||
x: 2.0,
|
data: [
|
||||||
y: 3.0
|
{
|
||||||
}
|
x: 2.0,
|
||||||
]);
|
y: 3.0
|
||||||
|
}
|
||||||
|
]
|
||||||
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
Reference in New Issue
Block a user