Skip to content

Commit

Permalink
async pattern loading, refactor
Browse files Browse the repository at this point in the history
  • Loading branch information
@karbor
karbor committed May 12, 2023
1 parent 41fd336 commit fbb3a36
Show file tree
Hide file tree
Showing 7 changed files with 102 additions and 209 deletions.
0 examples/well_correlation_data/__init__.py → examples/example_sync_log_viewer/__init__.py
View file
File renamed without changes.
0 ...ell_correlation_data/well_log_testdata.py → ...s/example_sync_log_viewer/example_data.py
View file
File renamed without changes.
2 changes: 1 addition & 1 deletion ...on_data/well_correlation_panel_testapp.py → ..._log_viewer/well_correlation_panel_app.py
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
import dash
import flask

from examples.well_correlation_data.well_log_testdata import (
from examples.example_sync_log_viewer.example_data import (
axis_mnemos,
axisTitles,
color_tables,
Expand Down
14 changes: 7 additions & 7 deletions react/src/demo/example-data/discrete-facies-test.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,7 @@
"dimensions": 1
},
{
"name": "PORO_TOT",
"name": "PORO",
"description": "continuous",
"quantity": "",
"unit": "",
Expand All @@ -47,25 +47,25 @@
[
1400,
2,
2,
1,
0.247
],
[
2179,
2,
1,
2,
0.247
],
[
2180.6093750344276,
2300.0,
3,
3,
2,
0.137
],
[
3541.6093750344276,
3,
3541.6,
3,
4,
0.237
],
[
Expand Down
116 changes: 8 additions & 108 deletions react/src/demo/example-data/synclog_template_lithologytrack.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,19 +13,6 @@
}
]
},
{
"plots": [
{
"name": "PORO"
},
{
"name": "NTG"
},
{
"name": "SW"
}
]
},
{
"plots": [
{
Expand All @@ -34,53 +21,23 @@
}
]
},
{
"plots": [
{
"name": "MFOA"
}
]
},
{
"plots": [
{
"name": "FACIES",
"style": "discrete"
"name": "PORO"
},
{
"name": "NTG"
},
{
"name": "SW"
}
]
},
{
"plots": [
{
"name": "DD_VOLUME"
}
]
},
{
"plots": [
{
"name": "TEMP"
}
]
},
{
"plots": [
{
"name": "BITSIZE"
}
]
},
{
"plots": [
{
"name": "GRSIM"
}
]
},
{
"plots": [
{
"name": "RACESHM"
"name": "MFOA"
}
]
},
Expand All @@ -99,63 +56,6 @@
"type": "dot"
}
]
},
{
"plots": [
{
"name": "MDIA",
"style": "MD"
}
]
},
{
"plots": [
{
"name": "MTOA"
}
]
},
{
"plots": [
{
"name": "MTIA"
}
]
},
{
"plots": [
{
"name": "ECDT"
}
]
},
{
"plots": [
{
"name": "BDTI"
}
]
},
{
"plots": [
{
"name": "BDDI"
}
]
},
{
"plots": [
{
"name": "BRVC"
}
]
},
{
"plots": [
{
"name": "TCTI"
}
]
}
],
"styles": [
Expand Down
85 changes: 51 additions & 34 deletions react/src/lib/components/WellLogViewer/components/LithologyTrack.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -50,47 +50,63 @@ export class LithologyTrack extends StackedTrack {
constructor(id: string | number, props: LithologyTrackOptions) {
super(id, props);
this.lithologyInfo = props.lithologyInfoTable as LithologyInfoTable; // TODO - ensure table is given and valid
setupLithologyInfoMap(this.lithologyInfo);
this.patterns = new Map<string | number, CanvasPattern | string>();
this.loadPatterns = this.loadPatterns.bind(this);
}

loadPatterns(): void {
const { data } = this;
if (!data) return;
async loadPatterns():Promise<void> {
return new Promise<void>(resolve => {
const { data } = this;
if (!data) return;
// Find unique canvas code names in data for this track. Later only load images for used codes
const uniqueCodes = [
...new Set(data.map((item: LithologyTrackDataRow) => item.name)),
] as (string | number)[]; // TODO: why doesn't typescript understand this itself?

// Find unique canvas code names in data for this track. Later only load images for used codes
const uniqueCodes = [
...new Set(data.map((item: LithologyTrackDataRow) => item.name)),
] as (string | number)[]; // TODO: why doesn't typescript understand this itself?
setupLithologyInfoMap(this.lithologyInfo);
uniqueCodes.forEach((code) => {
const pattern = lithologyInfoMap.get(code);
// const pattern = patterns.find(pattern => code === pattern.code)
if (pattern?.patternImage) {
// Check if we have loaded pattern
if (!this.patterns.get(code)) {
// Temporarily set solid color while we get image to avoid fetching multiple times
this.patterns.set(code, "#eee");
// Create pattern
const patternImage = new Image();
patternImage.src = pattern.patternImage;
patternImage.onload = () => {
this.patterns.set(
code,
this.ctx?.createPattern(
patternImage,
"repeat"
) as CanvasPattern
);
};
let numUniquePatternsLoading = uniqueCodes.length;
uniqueCodes.forEach((code) => {
const pattern = lithologyInfoMap.get(code);
// const pattern = patterns.find(pattern => code === pattern.code)
if (pattern?.patternImage) {
// Check if we have loaded pattern
if (!this.patterns.get(code)) {
// Temporarily set solid color while we get image to avoid fetching multiple times
this.patterns.set(code, "#eee");
// Create pattern
const patternImage = new Image();
patternImage.src = pattern.patternImage;
patternImage.onload = () => {
this.patterns.set(
code,
this.ctx?.createPattern(
patternImage,
"repeat"
) as CanvasPattern
);
numUniquePatternsLoading -= 1;
// Resolve on last image.
if (numUniquePatternsLoading <= 0) {
this.isLoading = false;
resolve();
}
};
} else {
numUniquePatternsLoading -= 1;
}
} else {
numUniquePatternsLoading -= 1;
}
});
if (numUniquePatternsLoading <= 0) {
this.isLoading = false;
resolve();
}
});
})
}

plot(): void {
super.plot();
const { ctx, scale: yscale, data, patterns } = this;

if (!ctx || !data) return;
const rectangles = scaleData(yscale, data);
const { width: rectWidth, clientWidth, clientHeight } = ctx.canvas;
Expand Down Expand Up @@ -156,7 +172,8 @@ export class LithologyTrack extends StackedTrack {
options.data().then(
(data: LithologyTrackDataRow[]) => {
this.data = data;
this.plot();
// @ts-ignore
this.loadPatterns().then(this.plot());
},
(error: Error | string) => super.onError(error)
);
Expand Down Expand Up @@ -189,8 +206,8 @@ export class LithologyTrack extends StackedTrack {
this.plot();
}
onDataLoaded(): void {
this.loadPatterns();
this.plot();
// @ts-ignore
this.loadPatterns().then(this.plot());
}
}

Expand Down
Loading

0 comments on commit fbb3a36

Please sign in to comment.