Skip to content

Commit 5e69bf1

Browse files
committed
Add methods for getting default styles
1 parent ab55fba commit 5e69bf1

File tree

2 files changed

+156
-42
lines changed

2 files changed

+156
-42
lines changed

src/viewer.js

Lines changed: 149 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -952,6 +952,7 @@ class VolumeImageViewer {
952952
const bitsAllocated = info.metadata[0].BitsAllocated
953953
const minStoredValue = 0
954954
const maxStoredValue = Math.pow(2, bitsAllocated) - 1
955+
955956
let paletteColorLookupTableUID
956957
let paletteColorLookupTable
957958
if (info.opticalPath.PaletteColorLookupTableSequence) {
@@ -980,6 +981,15 @@ class VolumeImageViewer {
980981
blueSegmentedData: item.SegmentedBluePaletteColorLookupTableData
981982
})
982983
}
984+
const defaultOpticalPathStyle = {
985+
opacity: 1,
986+
limitValues: [minStoredValue, maxStoredValue]
987+
}
988+
if (paletteColorLookupTable) {
989+
defaultOpticalPathStyle.paletteColorLookupTable = paletteColorLookupTable
990+
} else {
991+
defaultOpticalPathStyle.color = [255, 255, 255]
992+
}
983993

984994
const opticalPath = {
985995
opticalPathIdentifier,
@@ -1002,12 +1012,8 @@ class VolumeImageViewer {
10021012
paletteColorLookupTableUID
10031013
}),
10041014
pyramid: pyramid,
1005-
style: {
1006-
color: [255, 255, 255],
1007-
opacity: 1,
1008-
limitValues: [minStoredValue, maxStoredValue],
1009-
paletteColorLookupTable: paletteColorLookupTable
1010-
},
1015+
style: { ...defaultOpticalPathStyle },
1016+
defaultStyle: defaultOpticalPathStyle,
10111017
bitsAllocated: bitsAllocated,
10121018
minStoredValue,
10131019
maxStoredValue,
@@ -1049,15 +1055,15 @@ class VolumeImageViewer {
10491055
opticalPath.style.limitValues[1]
10501056
)
10511057

1052-
let style
1058+
let layerStyle
10531059
if (opticalPath.style.paletteColorLookupTable) {
1054-
style = _getColorPaletteStyleForTileLayer({
1060+
layerStyle = _getColorPaletteStyleForTileLayer({
10551061
windowCenter,
10561062
windowWidth,
10571063
colormap: opticalPath.style.paletteColorLookupTable.data
10581064
})
10591065
} else {
1060-
style = _getColorInterpolationStyleForTileLayer({
1066+
layerStyle = _getColorInterpolationStyleForTileLayer({
10611067
windowCenter,
10621068
windowWidth,
10631069
color: opticalPath.style.color
@@ -1068,7 +1074,7 @@ class VolumeImageViewer {
10681074
source,
10691075
extent: pyramid.extent,
10701076
preload: this[_options].preload ? 1 : 0,
1071-
style: style,
1077+
style: layerStyle,
10721078
visible: false,
10731079
useInterimTilesOnError: false,
10741080
cacheSize: this[_options].tilesCacheSize
@@ -1091,7 +1097,7 @@ class VolumeImageViewer {
10911097
source,
10921098
extent: pyramid.extent,
10931099
preload: 0,
1094-
style: style,
1100+
style: layerStyle,
10951101
visible: false,
10961102
useInterimTilesOnError: false
10971103
})
@@ -1110,6 +1116,10 @@ class VolumeImageViewer {
11101116
const info = colorImageInformation[opticalPathIdentifier]
11111117
const pyramid = _computeImagePyramid({ metadata: info.metadata })
11121118

1119+
const defaultOpticalPathStyle = {
1120+
opacity: 1
1121+
}
1122+
11131123
const opticalPath = {
11141124
opticalPathIdentifier,
11151125
opticalPath: new OpticalPath({
@@ -1123,9 +1133,8 @@ class VolumeImageViewer {
11231133
return element.SOPInstanceUID
11241134
})
11251135
}),
1126-
style: {
1127-
opacity: 1
1128-
},
1136+
style: { ...defaultOpticalPathStyle },
1137+
defaultStyle: defaultOpticalPathStyle,
11291138
pyramid: pyramid,
11301139
bitsAllocated: 8,
11311140
minStoredValue: 0,
@@ -1362,12 +1371,12 @@ class VolumeImageViewer {
13621371
)
13631372

13641373
if (styleOptions.paletteColorLookupTable != null) {
1374+
opticalPath.style.paletteColorLookupTable = styleOptions.paletteColorLookupTable
13651375
const style = _getColorPaletteStyleForTileLayer({
13661376
windowCenter,
13671377
windowWidth,
13681378
colormap: styleOptions.paletteColorLookupTable.data
13691379
})
1370-
opticalPath.style.paletteColorLookupTable = styleOptions.paletteColorLookupTable
13711380
opticalPath.layer.setStyle(style)
13721381
opticalPath.overviewLayer.setStyle(style)
13731382
} else if (styleOptions.color != null) {
@@ -1431,6 +1440,37 @@ class VolumeImageViewer {
14311440
return opticalPath.opticalisMonochromatic
14321441
}
14331442

1443+
/**
1444+
* Get the default style of an optical path.
1445+
*
1446+
* @param {string} opticalPathIdentifier - Optical Path Identifier
1447+
* @return {Object} Default style of optical path
1448+
*/
1449+
getOpticalPathDefaultStyle (opticalPathIdentifier) {
1450+
const opticalPath = this[_opticalPaths][opticalPathIdentifier]
1451+
if (opticalPath == null) {
1452+
throw new Error(
1453+
'Cannot get default style of optical path. ' +
1454+
`Could not find optical path "${opticalPathIdentifier}".`
1455+
)
1456+
}
1457+
if (opticalPath.opticalPath.isMonochromatic) {
1458+
if (opticalPath.defaultStyle.paletteColorLookupTable) {
1459+
return {
1460+
paletteColorLookupTable: opticalPath.defaultStyle.paletteColorLookupTable,
1461+
opacity: opticalPath.defaultStyle.opacity,
1462+
limitValues: opticalPath.defaultStyle.limitValues
1463+
}
1464+
}
1465+
return {
1466+
color: opticalPath.defaultStyle.color,
1467+
opacity: opticalPath.defaultStyle.opacity,
1468+
limitValues: opticalPath.defaultStyle.limitValues
1469+
}
1470+
}
1471+
return { opacity: opticalPath.defaultStyle.opacity }
1472+
}
1473+
14341474
/**
14351475
* Get the style of an optical path.
14361476
*
@@ -2674,6 +2714,11 @@ class VolumeImageViewer {
26742714
`of series "${metadata.SeriesInstanceUID}"`
26752715
)
26762716

2717+
const defaultAnnotationGroupStyle = {
2718+
opacity: 1.0,
2719+
color: '#027ea3'
2720+
}
2721+
26772722
metadata.AnnotationGroupSequence.forEach((item, index) => {
26782723
const annotationGroupUID = item.AnnotationGroupUID
26792724
const algorithm = item.AnnotationGroupAlgorithmIdentificationSequence[0]
@@ -2690,10 +2735,8 @@ class VolumeImageViewer {
26902735
seriesInstanceUID: metadata.SeriesInstanceUID,
26912736
sopInstanceUIDs: [metadata.SOPInstanceUID]
26922737
}),
2693-
style: {
2694-
opacity: 1.0,
2695-
color: '#027ea3'
2696-
},
2738+
style: { ...defaultAnnotationGroupStyle },
2739+
defaultStyle: defaultAnnotationGroupStyle,
26972740
metadata: metadata
26982741
}
26992742

@@ -3034,6 +3077,27 @@ class VolumeImageViewer {
30343077
}
30353078
}
30363079

3080+
/**
3081+
* Get default style of an annotation group.
3082+
*
3083+
* @param {string} annotationGroupUID - Unique identifier of an annotation group
3084+
*
3085+
* @returns {Object} - Default style settings
3086+
*/
3087+
getAnnotationGroupDefaultStyle (annotationGroupUID) {
3088+
if (!(annotationGroupUID in this[_annotationGroups])) {
3089+
throw new Error(
3090+
'Cannot get default style of annotation group. ' +
3091+
`Could not find annotation group "${annotationGroupUID}".`
3092+
)
3093+
}
3094+
const annotationGroup = this[_annotationGroups][annotationGroupUID]
3095+
return {
3096+
opacity: annotationGroup.defaultStyle.opacity,
3097+
color: annotationGroup.defaultStyle.color
3098+
}
3099+
}
3100+
30373101
/**
30383102
* Get style of an annotation group.
30393103
*
@@ -3185,6 +3249,14 @@ class VolumeImageViewer {
31853249
maxZoomLevel = maxZoomLevel - 1
31863250
}
31873251

3252+
const defaultSegmentStyle = {
3253+
opacity: 0.75,
3254+
paletteColorLookupTable: buildPaletteColorLookupTable({
3255+
data: colormap,
3256+
firstValueMapped: 0
3257+
})
3258+
}
3259+
31883260
const segment = {
31893261
segment: new Segment({
31903262
uid: segmentUID,
@@ -3201,13 +3273,8 @@ class VolumeImageViewer {
32013273
})
32023274
}),
32033275
pyramid,
3204-
style: {
3205-
opacity: 0.75,
3206-
paletteColorLookupTable: buildPaletteColorLookupTable({
3207-
data: colormap,
3208-
firstValueMapped: 0
3209-
})
3210-
},
3276+
style: { ...defaultSegmentStyle },
3277+
defaultStyle: defaultSegmentStyle,
32113278
overlay: new Overlay({
32123279
element: document.createElement('div'),
32133280
offset: [5 + 5 * index + 2, 5]
@@ -3429,6 +3496,27 @@ class VolumeImageViewer {
34293496
this[_map].addOverlay(segment.overlay)
34303497
}
34313498

3499+
/**
3500+
* Get the default style of a segment.
3501+
*
3502+
* @param {string} segmentUID - Unique tracking identifier of segment
3503+
*
3504+
* @returns {Object} Default style settings
3505+
*/
3506+
getSegmentDefaultStyle (segmentUID) {
3507+
if (!(segmentUID in this[_segments])) {
3508+
throw new Error(
3509+
'Cannot get default style of segment. ' +
3510+
`Could not find segment "${segmentUID}".`
3511+
)
3512+
}
3513+
const segment = this[_segments][segmentUID]
3514+
return {
3515+
opacity: segment.defaultStyle.opacity,
3516+
paletteColorLookupTable: segment.defaultStyle.paletteColorLookupTable
3517+
}
3518+
}
3519+
34323520
/**
34333521
* Get the style of a segment.
34343522
*
@@ -3444,7 +3532,6 @@ class VolumeImageViewer {
34443532
)
34453533
}
34463534
const segment = this[_segments][segmentUID]
3447-
34483535
return {
34493536
opacity: segment.style.opacity,
34503537
paletteColorLookupTable: segment.style.paletteColorLookupTable
@@ -3647,6 +3734,18 @@ class VolumeImageViewer {
36473734
maxZoomLevel = maxZoomLevel - 1
36483735
}
36493736

3737+
const defaultMappingStyle = {
3738+
opacity: 1.0,
3739+
limitValues: [
3740+
Math.ceil(windowCenter - windowWidth / 2),
3741+
Math.floor(windowCenter + windowWidth / 2)
3742+
],
3743+
paletteColorLookupTable: buildPaletteColorLookupTable({
3744+
data: colormap,
3745+
firstValueMapped: 0
3746+
})
3747+
}
3748+
36503749
const mapping = {
36513750
mapping: new ParameterMapping({
36523751
uid: mappingUID,
@@ -3663,17 +3762,8 @@ class VolumeImageViewer {
36633762
element: document.createElement('div'),
36643763
offset: [5 + 100 * index + 2, 5]
36653764
}),
3666-
style: {
3667-
opacity: 1.0,
3668-
limitValues: [
3669-
Math.ceil(windowCenter - windowWidth / 2),
3670-
Math.floor(windowCenter + windowWidth / 2)
3671-
],
3672-
paletteColorLookupTable: buildPaletteColorLookupTable({
3673-
data: colormap,
3674-
firstValueMapped: 0
3675-
})
3676-
},
3765+
style: { ...defaultMappingStyle },
3766+
defaultStyle: defaultMappingStyle,
36773767
minStoredValue,
36783768
maxStoredValue,
36793769
minZoomLevel,
@@ -3905,6 +3995,27 @@ class VolumeImageViewer {
39053995
this[_map].addOverlay(mapping.overlay)
39063996
}
39073997

3998+
/**
3999+
* Get the default style of a parameter mapping.
4000+
*
4001+
* @param {string} mappingUID - Unique tracking identifier of mapping
4002+
* @returns {Object} Default style Options
4003+
*/
4004+
getParameterMappingDefaultStyle (mappingUID) {
4005+
if (!(mappingUID in this[_mappings])) {
4006+
throw new Error(
4007+
'Cannot get default style of mapping. ' +
4008+
`Could not find mapping "${mappingUID}".`
4009+
)
4010+
}
4011+
const mapping = this[_mappings][mappingUID]
4012+
return {
4013+
opacity: mapping.defaultStyle.opacity,
4014+
limitValues: mapping.defaultStyle.limitValues,
4015+
paletteColorLookupTable: mapping.defaultStyle.paletteColorLookupTable
4016+
}
4017+
}
4018+
39084019
/**
39094020
* Get the style of a parameter mapping.
39104021
*
@@ -3919,7 +4030,6 @@ class VolumeImageViewer {
39194030
)
39204031
}
39214032
const mapping = this[_mappings][mappingUID]
3922-
39234033
return {
39244034
opacity: mapping.style.opacity,
39254035
limitValues: mapping.style.limitValues,

src/viewer.test.js

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -798,10 +798,11 @@ describe.each(testCases)('test viewer API for optical paths of "$name"', ({
798798
const expectedIds = Object.keys(expectations.opticalPaths)
799799
expectedIds.forEach(id => {
800800
const style = viewer.getOpticalPathStyle(id)
801-
const expectedOpticalPath = expectations.opticalPaths[
802-
id
803-
]
801+
const defaultStyle = viewer.getOpticalPathDefaultStyle(id)
802+
const expectedOpticalPath = expectations.opticalPaths[id]
804803
expect(style).toEqual(expectedOpticalPath.style)
804+
expect(!(style.color != null && style.paletteColorLookupTable != null))
805+
expect(defaultStyle).toEqual(expectedOpticalPath.style)
805806
})
806807
})
807808

@@ -817,6 +818,9 @@ describe.each(testCases)('test viewer API for optical paths of "$name"', ({
817818
expectedStyle[key] = styleOptions[key]
818819
})
819820
expect(style).toEqual(expectedStyle)
821+
expect(!(style.color != null && style.paletteColorLookupTable != null))
822+
const defaultStyle = viewer.getOpticalPathDefaultStyle(id)
823+
expect(defaultStyle).not.toEqual(expectedStyle)
820824
})
821825

822826
it('should change optical path visibility', () => {

0 commit comments

Comments
 (0)