Example
<cr-component id="component" name="analysis-regions"></cr-component>
<script>
const component = document.querySelector("#component");
component.init({
positions: [
{ id: 134230, amount: 231454.29, amount: 231454.29, date: "20181231" },
{ id: 128520, amount: 14037.94, amount: 14037.94, date: "20181231" },
{ id: 146057, amount: 1551576.47, amount: 1551576.47, date: "20181231" },
{ id: 73170, amount: 2288780.71, amount: 2288780.71, date: "20181231" },
{ id: 23772, amount: 1394051.32, amount: 1394051.32, date: "20181231" },
{ id: 67992, amount: 485800.88, amount: 485800.88, date: "20181231" },
{ id: 90197, amount: 165708.97, amount: 165708.97, date: "20181231" },
{ id: 57398, amount: 441988.97, amount: 441988.97, date: "20181231" },
{ id: 75109, amount: 641332.79, amount: 641332.79, date: "20190108" },
{ id: 74838, amount: 167581.21, amount: 167581.21, date: "20190108" },
{ id: 111228, amount: 166207.69, amount: 166207.69, date: "20190108" },
{ id: 38951, amount: 446148.27, amount: 446148.27, date: "20190108" },
{ id: 2561, amount: 396582.75, amount: 396582.75, date: "20190108" },
{ id: 86420, amount: 26055, amount: 26055, date: "20191029" },
{ id: 86621, amount: 71202.88, amount: 71202.88, date: "20191029" },
{ id: 99452, amount: 24996.22, amount: 24996.22, date: "20191029" },
{ id: 105043, amount: 34003.12, amount: 34003.12, date: "20191029" },
{ id: 42853, amount: 33237.68, amount: 33237.68, date: "20191029" },
{ id: 146382, amount: 70842.53, amount: 70842.53, date: "20191029" },
],
});
</script>
Schema
{
"type": "object",
"properties": {
"assessmentId": {
"type": "integer",
"minimum": 1,
"description": "Assessment identifier"
},
"proposalId": {
"type": "integer",
"minimum": 1,
"description": "Proposal identifier"
},
"positions": {
"type": "array",
"minItems": 1,
"description": "Portfolio positions",
"items": {
"type": "object",
"required": [
"symbolId",
"amount"
],
"properties": {
"symbolId": {
"type": "number"
},
"amount": {
"type": "number"
},
"date": {
"type": "string"
},
"color": {
"type": "string"
}
}
}
},
"symbolId": {
"type": "number"
}
},
"additionalProperties": true,
"oneOf": [
{
"required": [
"assessmentId"
],
"prohibited": [
"proposalId",
"positions",
"symbolId"
]
},
{
"required": [
"proposalId"
],
"prohibited": [
"assessmentId",
"positions",
"symbolId"
]
},
{
"required": [
"positions"
],
"prohibited": [
"assessmentId",
"proposalId",
"symbolId"
]
},
{
"required": [
"symbolId"
],
"prohibited": [
"assessmentId",
"proposalId",
"positions"
]
}
]
}
Complete Schema
{}
CSS Variables
--color-regions-1: var(--color-aqua-2);
--color-regions-2: var(--color-aqua-4);
--color-regions-3: var(--color-aqua-6);
--color-regions-4: var(--color-aqua-8);
--color-regions-5: var(--color-aqua-10);
Locales
{
"title": "Regions"
}