Fixed incorrect response from xray converter.

highcharts · Nov 27, 2024 · 9d36132 · 9d36132
1 parent 024d363
commit 9d36132
Show file tree

Hide file tree

Showing 4 changed files with 149 additions and 3 deletions.
diff --git a/demos/xray_wip/demo.css b/demos/xray_wip/demo.css
@@ -0,0 +1,38 @@
+@import url("https://code.highcharts.com/dashboards/css/datagrid.css");
+@import url("https://code.highcharts.com/css/highcharts.css");
+@import url("https://code.highcharts.com/dashboards/css/dashboards.css");
+
+body {
+    font-family: "Helvetica Neue", Helvetica, "Segoe UI", Arial, sans-serif;
+}
+
+.row {
+    display: flex;
+    flex-wrap: wrap;
+}
+
+.cell {
+    flex: 1;
+    min-width: 20px;
+}
+
+.cell > .highcharts-dashboards-component {
+    position: relative;
+    margin: 10px;
+    background-clip: border-box;
+}
+
+.highcharts-dashboards-component-title {
+    padding: 10px;
+    margin: 0;
+    background-color: var(--highcharts-neutral-color-5);
+    color: var(--highcharts-neutral-color-100);
+    border: solid 1px var(--highcharts-neutral-color-20);
+    border-bottom: none;
+}
+
+@media screen and (max-width: 1000px) {
+    .row {
+        flex-direction: column;
+    }
+}
diff --git a/demos/xray_wip/demo.html b/demos/xray_wip/demo.html
@@ -0,0 +1,25 @@
+<!DOCTYPE html>
+<html>
+    <head>
+        <meta charset="UTF-8" />
+        <link rel="stylesheet" href="demo.css" />
+        <script src="https://code.highcharts.com/dashboards/datagrid.js"></script>
+        <script src="https://code.highcharts.com/highcharts.js"></script>
+        <script src="https://code.highcharts.com/dashboards/dashboards.js"></script>
+        <script src="../../code/connectors-morningstar.src.js"></script>
+        <title>Highcharts Dashboards + Morningstar Portfolio Risk Score</title>
+    </head>
+    <body>
+        <h1>Highcharts Dashboards + Morningstar Portfolio Risk Score</h1>
+        <p>
+            Add your Postman environment file from Morningstar to start the demo:
+            <input type="file" id="postman-json" accept=".json,application/json" />
+        </p>
+        <p id="loading-label" style="display: none;">Loading data…</p>
+        <div class="row" id="container">
+            <div class="cell" id="dashboard-col-0"></div>
+            <div class="cell" id="dashboard-col-1"></div>
+        </div>
+        <script src="./demo.js"></script>
+    </body>
+</html>
diff --git a/demos/xray_wip/demo.js b/demos/xray_wip/demo.js
@@ -0,0 +1,77 @@
+async function displaySecurityDetails (postmanJSON) {
+   const board = Dashboards.board('container', {
+    dataPool: {
+        connectors: [{
+            id: 'xray',
+            type: 'MorningstarXRay',
+            options: {
+                postman: {
+                    environmentJSON: postmanJSON
+                },
+                currencyId: 'GBP',
+                dataPoints: {
+                    type: 'portfolio',
+                    dataPoints: [
+                        'AssetAllocationMorningstarEUR3',
+                        'GlobalStockSector',
+                        'RegionalExposure'
+                    ]
+                },
+                holdings: [
+                    {
+                        id: 'F0GBR052QA',
+                        idType: 'MSID',
+                        type: 'FO',
+                        weight: '100'
+                    }
+                ]
+            }
+        }]
+    },
+    components: [
+        {
+            renderTo: 'dashboard-col-1',
+            connector: {
+                id: 'xray'
+            },
+            type: 'DataGrid',
+            title: 'RiskScore'
+        }
+    ]
+});
+
+board.dataPool
+    .getConnectorTable('xray')
+    .then(() => {});
+
+}
+
+async function handleSelectEnvironment (evt) {
+   const target = evt.target;
+   const postmanJSON = await getPostmanJSON(target);
+
+   target.parentNode.style.display = 'none';
+
+   displaySecurityDetails(postmanJSON);
+}
+
+document.getElementById('postman-json')
+   .addEventListener('change', handleSelectEnvironment);
+
+async function getPostmanJSON (htmlInputFile) {
+   let file;
+   let fileJSON;
+
+   for (file of htmlInputFile.files) {
+       try {
+           fileJSON = JSON.parse(await file.text());
+           if (Connectors.Morningstar.isPostmanEnvironmentJSON(fileJSON)) {
+               break;
+           }
+       } catch (error) {
+           // fail silently
+       }
+   }
+
+   return fileJSON;
+}
diff --git a/src/XRay/XRayConverter.ts b/src/XRay/XRayConverter.ts
@@ -125,12 +125,18 @@ export class XRayConverter extends MorningstarConverter {
     ): void {
         const table = this.table;
 
+        table.setColumn(`${benchmarkId}_Values`);
+
         for (const asset of json.assetAllocation) {
-            const rowId = `${benchmarkId}_${asset.type}_${asset.salePosition}`;
+            const columnName = `${benchmarkId}_${asset.type}_${asset.salePosition}`;
+            table.setColumn(columnName);
             const values = asset.values;
 
-            for (let i = 1; i < 100; ++i) {
-                table.setCell(rowId, i - 1, values[i]);
+            const valueIndex = Object.keys(values);
+
+            for (let i = 0; i < valueIndex.length; i++) {
+                table.setCell(`${benchmarkId}_Values`, i, valueIndex[i]);
+                table.setCell(columnName, i, values[parseInt(valueIndex[i])]);
             }
         }