Field DICOM
The Field DICOM Viewer permits builders to retailer, view and share DICOM recordsdata like
X-rays, CT scans, Ultrasounds and MRIs securely with Field whereas nonetheless embedding
the viewer into their very own software.
The Field DICOM Viewer is an FDA cleared Class II Medical Gadget for diagnostic
viewing. It’s a zero-footprint HTML5 viewer and could be embedded into an
software in an <iframe> or with a Javascript SDK.
In case you are a developer and wish to embed the Field DICOM Viewer into your
software, please electronic mail us at for extra info.
The present model for Field DICOM is
Replace to v1.3.0 or increased
In case you are utilizing a model of the DICOM Viewer previous to v1.3.0, please
improve to v1.3.0 or increased.
To make use of a unique locale, exchange en-US within the Javascript obtain URL above
with any of the next supported locales:
en-AUen-CAen-GBen-USda-DKde-DEes-ESfi-FIfr-CAfr-FRhu-HUit-ITja-JPko-KRnb-NOnl-NLpl-PLpt-BRru-RUsv-SEtr-TRzh-CNzh-TW
The Field DICOM viewer could be embedded in a HTML iframe or linked to immediately.
The URL sample for the Field DICOM Viewer is as follows.
https://cloud.app.box.com/dicom_viewer/{FILE_ID}
The File ID could be obtained from the API or from the Field net software person
interface.
The next choices could be supplied as question string parameters:
accessTokenA Field API entry tokensharedNameA worldwide hyperlink to a foldertoolbarA boolean parameter to point out or cover the highest toolbar. Default is true.overlaysA boolean parameter to point out or cover the textual content overlays. Default is true.worklistA boolean parameter to point out or cover the facet worklist. Default is true.
After the URL has been constructed, it may be embedded in an iframe or be
linked to immediately.
The next is an instance of an iframe embed.
<iframe width="800"
peak="600"
src="https://cloud.app.box.com/dicom_viewer/12345?toolbar=true"
allowfullscreen
>
<p>Field DICOM Viewer</p>
</iframe>
allowfullscreen is required The allowfullscreen attribute is required
for the Field DICOM viewer’s full-screen operate to work correctly.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Field DICOM Viewer</title>
<hyperlink
rel="stylesheet"
href="https://boxdicom.com/dist/1.3.5/dicom.min.css"
/>
<script src="https://boxdicom.com/dist/1.3.5/dicom-en-US.min.js"></script>
</head>
<physique>
<div class="box-dicom-viewer-body"></div>
<script>
field.dicom.createViewer(doc.querySelector(".box-dicom-viewer-body"), {
accessToken: "ACCESS_TOKEN_HERE",
research: [{ fileId: "FILE_ID_HERE" }]
});
</script>
</physique>
</html>
The first operate to create a viewer is field.dicom.createViewer(). The right
definition is:
field.dicom.createViewer(component, config);
componentThe DOM component to initialize the viewer into. Could be both a string (a DOM component ID) or an Ingredient (a DOM component).configThe configuration object.
The config is a Javascript object with many doable choices within the type of properties.
accessTokenThe entry token for the person. Will need to have entry to the .boxdicom file AND the entire particular person .dcm recordsdata.researchAn array of research to load. Every research is an object. Every research object can specify a research by the Field File ID ("fileID": "123456").overlaysElective overlay configuration particulars.toolbarElective toolbar configuration particulars.worklistElective worklist configuration particulars.hangingProtocolsElective hanging protocols to regulate the format and show settings of the research.
You’ll be able to allow / disable overlays utilizing the seen property:
{
"accessToken": "asdf",
"studies": [
/* ... */
],
"overlays": {
"visible": false
}
}
You’ll be able to management which fields are displayed utilizing the fields property:
{
"accessToken": "asdf",
"studies": [
/* ... */
],
"overlays": {
"visible": true,
"fields": [
box.dicom.core.Tag.PatientID,
box.dicom.core.Tag.StudyDate,
box.dicom.core.Tag.AdditionalPatientHistory,
box.dicom.core.Tag.PatientAge,
box.dicom.core.Tag.PatientSex,
box.dicom.core.Tag.StudyDescription,
box.dicom.core.Tag.SeriesDescription,
box.dicom.core.Tag.Modality
]
}
}
You’ll be able to present / cover the toolbar utilizing the seen property.
{
"accessToken": "asdf",
"studies": [
/* ... */
],
"toolbar": {
"visible": false
}
}
You’ll be able to management which buttons are displayed utilizing the buttons property:
{
"accessToken": "asdf",
"studies": [
/* ... */
],
"toolbar": {
"visible": true,
"buttons": [
box.dicom.viewer.Toolbar.Buttons.Logo,
box.dicom.viewer.Toolbar.Buttons.Separator,
box.dicom.viewer.Toolbar.Buttons.Stack,
box.dicom.viewer.Toolbar.Buttons.WindowLevel,
box.dicom.viewer.Toolbar.Buttons.Annotate
]
}
}
You’ll be able to present / cover the worklist utilizing the seen property.
{
"accessToken": "asdf",
"studies": [
/* ... */
],
"worklist": {
"visible": false
}
}
The Field DICOM Import device intelligently crawls by means of folders and subfolders to
discover your DICOM knowledge. It may possibly acknowledge non-DICOM to keep away from importing undesirable
content material akin to executables. The ensuing recordsdata are organized by affected person and
research particulars.
The Field DICOM Import widget could be embedded in your functions utilizing the
JavaScript SDK.
field.dicom.createImportWidget("my-container", {
accessToken: "MY_ACCESS_TOKEN",
folderId: "MY_FOLDER_ID"
});
Right here is an instance of how you can use the “success” callback:
field.dicom.createImportWidget("my-dicom-import-container", {
folderId: "123",
accessToken: "abc",
success: operate(e) {
console.log("Success!");
console.log(
"Patient Name = " +
e
.getStudy()
.getPatientName()
.getDisplayString()
);
console.log("Folder ID= " + e.getStudy().getFolderId());
console.log("File ID = " + e.getStudy().getFileId());
}
});
field.dicom.core.Tag.AdditionalPatientHistory,
field.dicom.core.Tag.BitsAllocated, field.dicom.core.Tag.BitsStored,
field.dicom.core.Tag.BluePaletteColorLookupTableData,
field.dicom.core.Tag.BluePaletteColorLookupTableDescriptor,
field.dicom.core.Tag.BodyPartExamined, field.dicom.core.Tag.Columns,
field.dicom.core.Tag.CompensatorPixelSpacing,
field.dicom.core.Tag.GreenPaletteColorLookupTableData,
field.dicom.core.Tag.GreenPaletteColorLookupTableDescriptor,
field.dicom.core.Tag.FrameOfReferenceUID, field.dicom.core.Tag.HighBit,
field.dicom.core.Tag.ImageOrientationPatient,
field.dicom.core.Tag.ImagePlanePixelSpacing,
field.dicom.core.Tag.ImagePositionPatient,
field.dicom.core.Tag.ImagerPixelSpacing, field.dicom.core.Tag.InstanceNumber,
field.dicom.core.Tag.InstitutionName, field.dicom.core.Tag.Merchandise,
field.dicom.core.Tag.ItemDelimitationItem,
field.dicom.core.Tag.ModalitiesInStudy, field.dicom.core.Tag.Modality,
field.dicom.core.Tag.NumberOfFrames, field.dicom.core.Tag.OverlayColumns,
field.dicom.core.Tag.OverlayData, field.dicom.core.Tag.OverlayRows,
field.dicom.core.Tag.PatientAge, field.dicom.core.Tag.PatientBirthDate,
field.dicom.core.Tag.PatientName, field.dicom.core.Tag.PatientID,
field.dicom.core.Tag.PatientSex, field.dicom.core.Tag.PhotometricInterpretation,
field.dicom.core.Tag.PixelData, field.dicom.core.Tag.PixelRepresentation,
field.dicom.core.Tag.PixelSpacing,
field.dicom.core.Tag.PresentationPixelSpacing,
field.dicom.core.Tag.PrinterPixelSpacing, field.dicom.core.Tag.ProtocolName,
field.dicom.core.Tag.RedPaletteColorLookupTableData,
field.dicom.core.Tag.RedPaletteColorLookupTableDescriptor,
field.dicom.core.Tag.ReferringPhysicianName,
field.dicom.core.Tag.RescaleIntercept, field.dicom.core.Tag.RescaleSlope,
field.dicom.core.Tag.Rows, field.dicom.core.Tag.SequenceDelimitationItem,
field.dicom.core.Tag.SeriesDescription, field.dicom.core.Tag.SeriesInstanceUID,
field.dicom.core.Tag.SeriesNumber, field.dicom.core.Tag.SOPInstanceUID,
field.dicom.core.Tag.SpecificCharacterSet, field.dicom.core.Tag.StudyDate,
field.dicom.core.Tag.StudyDescription, field.dicom.core.Tag.StudyInstanceUID,
field.dicom.core.Tag.TransferSyntaxUID, field.dicom.core.Tag.WindowCenter,
field.dicom.core.Tag.WindowCenterWidthExplanation,
field.dicom.core.Tag.WindowWidth
field.dicom.viewer.Toolbar.Buttons.Log,
field.dicom.viewer.Toolbar.Buttons.Separato,
field.dicom.viewer.Toolbar.Buttons.Stac,
field.dicom.viewer.Toolbar.Buttons.WindowLeve,
field.dicom.viewer.Toolbar.Buttons.Zoo, field.dicom.viewer.Toolbar.Buttons.Pa,
field.dicom.viewer.Toolbar.Buttons.ThreeDCurso,
field.dicom.viewer.Toolbar.Buttons.Annotate,
field.dicom.viewer.Toolbar.Buttons.Separato,
field.dicom.viewer.Toolbar.Buttons.Gri,
field.dicom.viewer.Toolbar.Buttons.Overlay,
field.dicom.viewer.Toolbar.Buttons.Extra