Page History
...
The configuration files are available at public/config
. There are 4 four configuration files:1.
dataSource
.json ThedataSource.json
file specifies information about the data repository. Refer to thedataSource.
...
jso
n documentation for a detailed description.
...
dataDescription.json
ThedataDescription.json
file specifies information regarding each attribute in the data. An attribute could be visual , filtering or key. Refer to thedataDescription.json
documentation.
...
interactiveFilters.json
Specifies information for interactive filters that appear on the left side of the dashboard. Refer tointeractiveFilters.json
documentation.
...
visualization.json
Specify the type of visualization that shall appear on the main display panel. Refer tovisualization.json
documentation.
DataSource.json
For a complete overview please look at , refer to the Schema Reference
Multiexcerpt include | ||||||
---|---|---|---|---|---|---|
|
system would use the information to access the data and use it for creating the dashboards.
Consider the following example in which we're fetching data from 2 sources s1 and s2 .
Code Block |
---|
{ "dataSourceAlias" : "sourceJoin" , "joinKey" : [ "A" ], "dataSources" : [ { "sourceName" : "s1" , "sourceType" : "csv" , "options" :{ "path" : "examples/newDataSourceConfig/data/data1.csv" }, "dataAttributes" : [ "A" , "B" , "C" ] }, { "sourceName" : "s2" , "sourceType" : "csv" , "options" :{ "path" : "examples/newDataSourceConfig/data/data2.csv" }, "dataAttributes" : [ "A" , "D" ] } ] } |
...
dataSourceAlias
: Name of the data source. Used bydatadescription.json
to identify data sources.
...
joinKey
: Attribute used for joining the data sources. Must be present in all the sources.
...
sourceName
: Used to identify the data source.
...
sourceType
: The type of data source. The system currently supports: json, csv, rest/json, rest/csv, odbc .
...
options
: An object used to specify the path of the data source.
...
dataAttributes
: The attributes provided by this data source. Accepts an array of strings.
Data Description
For a complete overview please look at , refer to the Data Description Schema Reference
. The dataDescription.json
file is the specification that the data provider provides, which provides the system, the information pertaining to the number of attributes, the type of each attribute,
whether or not filtering would be performed on the attribute, etc.
The following is an example of a dataDescription.json
file:
Code Block |
---|
[ |
...
{ |
...
"attributeName" : "A" , |
...
"datatype" : "enum" , |
...
"attributeType" : [ "visual" , "filtering" ], |
...
"dataSourceAlias" : "sourceJoin" |
...
}, |
...
{ |
...
"attributeName" : "B" , |
...
"datatype" : "enum" , |
...
"attributeType" : [ "filtering" ], |
...
"dataSourceAlias" : "sourceJoin" |
...
}, |
...
{ |
...
"attributeName" : "C" , |
...
"datatype" : "enum" , |
...
"attributeType" : [ "visual" , "filtering" ], |
...
"dataSourceAlias" : "sourceJoin" |
...
}, |
...
{ |
...
"attributeName" : "D" , |
...
"datatype" : "enum" , |
...
"attributeType" : [ "visual" , "filtering" ], |
...
"dataSourceAlias" : "sourceJoin" |
...
} |
...
] |
Interactive Filters
interactiveFilters.json
For a complete overview please look at , refer to the Schema Reference Used to define the interactive
filters panel that is displayed on the left of the dashboard.
This file describes how the dashboard should look like.
Code Block |
---|
[ |
...
{ |
...
"attributeName" : "A" , |
...
"visualization" : { |
...
"visType" : "rowChart" |
...
} |
...
}, |
...
{ |
...
"attributeName" : "B" , |
...
"visualization" : { |
...
"visType" : "pieChart" |
...
} |
...
}, |
...
{ |
...
"attributeName" : "C" , |
...
"visualization" : { |
...
"visType" : "pieChart" |
...
} |
...
}, |
...
{ |
...
"attributeName" : "D" , |
...
"visualization" : { |
...
"visType" : "pieChart" |
...
} |
...
} |
...
] |
...
attributeName
(String): The name of the attribute with which it is refered to. It should be
...
- the same as provided in the backend schema.
...
visualization
(Object): Used to define information regarding the visualization.
...
visType
(String): The type of visualization to be done. Currently supports:barChart
,
...
-
rowChart
, andpieChart
.
Info |
---|
Notes on visTypes |
...
|
...
|
...
|
Visualization.json
Accepts an array of objects, each object describing the visualization. Example:
Code Block |
---|
[ |
...
{ |
...
"visualizationType" : "dataTable" , |
...
"attributes" :[ |
...
{ "attributeName" : "CancerType" }, |
...
{ "attributeName" : "BCRPatientUIDFromClinical" }, |
...
{ "attributeName" : "BCRSlideUID" }, |
...
{ "attributeName" : "BCRPatientUIDFromPathology" } |
...
], |
...
"heading" : "TCGA" , |
...
"subheading" : "" |
...
}, |
...
{ |
...
"visualizationType" : "imageGrid" , |
...
"attributes" :[ |
...
{ |
...
"attributeName" : "image" , |
...
"type" : "image" |
...
} |
...
], |
...
"heading" : "Bubble Chart" , |
...
"subheading" : "Using synthetic data" |
...
}, |
...
{ |
...
"visualizationType" : "heatMap" , |
...
"attributes" :[ |
...
{ |
...
"attributeName" : "AgeatInitialDiagnosis" , |
...
"type" : "x" |
...
}, |
...
{ |
...
"attributeName" : "KarnofskyScore" , |
...
"type" : "y" |
...
} |
...
], |
...
"heading" : "Heat Map" , |
...
"subheading" : "AgeatInitialDiagnosis vs KarnofskyScore" |
...
} |
...
] |
In the above example we have 3 visualizations dataTable , imageGrid and heatMap. Details of the
supported visualizations are described below.
The system currently supports 4 types of visualizations:
1. dataTable
2. bubbleChart
3. imageGrid
4. heatMap
1. dataTable
Provides a tabular representation of the provided attributes. Shows 100 records at a time.
{
"visualizationType" : "dataTable" ,
"attributes" :[
{ "attributeName" : "id" },
{ "attributeName" : "Ai" },
{ "attributeName" : "Di" }
]
}
2. bubbleChart
A bubble chart representation of the provided attributes. Can be used to visualize 4 dimensions.
{
"visualizationType" : "bubbleChart" ,
"attributes" :[
{
"attributeName" : "a1" ,
"type" : "x" ,
"dimension" : true
},
{
"attributeName" : "a2" ,
"type" : "y"
},
{
"attributeName" : "a3" ,
"type" : "color"
},
{
"attributeName" : "a4" ,
"type" : "r"
},
]
}
Following types are used to represent 4 dimensions on the chart.
● x : on the x axis
● y : on the y axis
● r : radius of bubbles
● color : colors of bubbles
Atleast one attributes needs to have dimension : true.
3. imageGrid
Creates an image grid using the images from the attribute having type: image
{
"visualizationType" : "imageGrid" ,
"attributes" :[
{
"attributeName" : "image" ,
"type" : "image"
}
],
"heading" : "Image grid" ,
"subheading" : "Using dummy data"
}
Requires an attribute to have "type": "image" which shall be used as the location of the image.
4. heatMap
{
"visualizationType" : "heatMap" ,
"attributes" :[
{
"attributeName" : "AgeatInitialDiagnosis" ,
"type" : "x"
},
{
"attributeName" : "KarnofskyScore" ,
"type" : "y"
}
],
"heading" : "Heat Map" ,
"subheading" : "AgeatInitialDiagnosis vs KarnofskyScore"
}
Requires attributes having "type": "x" and "type": "y" for the x and y axes respectively
...