\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
See how it works
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n\r\n\r\n\r\n\r\n\r\n","import { render } from \"./SunburstWalkthroughMobile.vue?vue&type=template&id=14a78754&scoped=true\"\nimport script from \"./SunburstWalkthroughMobile.vue?vue&type=script&lang=js\"\nexport * from \"./SunburstWalkthroughMobile.vue?vue&type=script&lang=js\"\n\nimport \"./SunburstWalkthroughMobile.vue?vue&type=style&index=0&id=14a78754&lang=scss&scoped=true\"\n\nimport exportComponent from \"D:\\\\bamboo-home\\\\xml-data\\\\build-dir\\\\AS-REL-JOB1\\\\code\\\\src\\\\Web\\\\AS.Presentation\\\\apps\\\\sunburst\\\\node_modules\\\\vue-loader-v16\\\\dist\\\\exportHelper.js\"\nconst __exports__ = /*#__PURE__*/exportComponent(script, [['render',render],['__scopeId',\"data-v-14a78754\"]])\n\nexport default __exports__","import { render } from \"./Home.vue?vue&type=template&id=6357951c\"\nimport script from \"./Home.vue?vue&type=script&lang=js\"\nexport * from \"./Home.vue?vue&type=script&lang=js\"\n\nimport \"./Home.vue?vue&type=style&index=0&id=6357951c&lang=scss\"\n\nimport exportComponent from \"D:\\\\bamboo-home\\\\xml-data\\\\build-dir\\\\AS-REL-JOB1\\\\code\\\\src\\\\Web\\\\AS.Presentation\\\\apps\\\\sunburst\\\\node_modules\\\\vue-loader-v16\\\\dist\\\\exportHelper.js\"\nconst __exports__ = /*#__PURE__*/exportComponent(script, [['render',render]])\n\nexport default __exports__","import { render } from \"./App.vue?vue&type=template&id=03ccb019\"\nimport script from \"./App.vue?vue&type=script&lang=js\"\nexport * from \"./App.vue?vue&type=script&lang=js\"\n\nimport exportComponent from \"D:\\\\bamboo-home\\\\xml-data\\\\build-dir\\\\AS-REL-JOB1\\\\code\\\\src\\\\Web\\\\AS.Presentation\\\\apps\\\\sunburst\\\\node_modules\\\\vue-loader-v16\\\\dist\\\\exportHelper.js\"\nconst __exports__ = /*#__PURE__*/exportComponent(script, [['render',render]])\n\nexport default __exports__","import { createStore } from 'vuex'\r\nimport axios from 'axios'\r\nimport sunburstSidebarWalkthrough from '@/assets/data/data-sunburst-sidebar-walkthrough.json'\r\n\r\nexport default createStore({\r\n state: {\r\n appPreloader: true,\r\n chartInteraction: false,\r\n appWidth: null,\r\n appHeight: null,\r\n appWalkthrough: true,\r\n pointValue: 0,\r\n sideBarScroll: false,\r\n sideBarESGRatingInfo: false,\r\n sideBarCompanies: false,\r\n sideBarInvestmentOptions: [],\r\n sideBarLevelClicked: 0,\r\n activeInvestmentsId: null,\r\n activeInvestmentsSearchFilter: 'all',\r\n activeInvestmentsSearchCategory: '',\r\n activeInvestmentsSearchAssetClass: '',\r\n activeInvestmentOption: null,\r\n activeInvestmentsSearchId: '',\r\n sunburstInvestments: [],\r\n sideBarInvestmentsSearch: [],\r\n sunburstWalkthroughStep: 0,\r\n sunburstSidebarWalkthrough: sunburstSidebarWalkthrough,\r\n walkthroughToken: '',\r\n sunburstTitle: '',\r\n introText: '',\r\n introProxyText: '',\r\n step1Title: '',\r\n step1Body: '',\r\n step2Title: '',\r\n step2Body: '',\r\n step3Title: '',\r\n step3Body: '',\r\n step4Title: '',\r\n step4Body: '',\r\n step5Title: '',\r\n step5Body: ''\r\n },\r\n getters: {\r\n },\r\n mutations: {\r\n setAppPreloader (state, payload) {\r\n state.appPreloader = payload\r\n },\r\n setWalkthroughToken (state, payload) {\r\n state.walkthroughToken = payload\r\n },\r\n setChartInteraction (state, payload) {\r\n state.chartInteraction = payload\r\n },\r\n setActiveInvestmentsId (state, payload) {\r\n state.activeInvestmentsId = payload\r\n },\r\n setAppWidth (state, payload) {\r\n state.appWidth = payload\r\n },\r\n setAppHeight (state, payload) {\r\n state.appHeight = payload\r\n },\r\n setPointName (state, payload) {\r\n state.pointName = payload\r\n },\r\n setSideBarScroll (state, payload) {\r\n state.sideBarScroll = payload\r\n },\r\n setPointValue (state, payload) {\r\n state.pointValue = payload\r\n },\r\n setAppWalkthrough (state, payload) {\r\n state.appWalkthrough = payload\r\n },\r\n setAppSidebarESGRatingInfo (state, payload) {\r\n state.sideBarESGRatingInfo = payload\r\n },\r\n setSideBarCompanies (state, payload) {\r\n state.sideBarCompanies = payload\r\n },\r\n setSideBarCompaniesSearch (state, payload) {\r\n state.sideBarCompanies = true\r\n state.sideBarInvestmentsSearch = payload\r\n },\r\n setActiveFilter (state, payload) {\r\n state.activeInvestmentsSearchFilter = payload\r\n },\r\n setActiveInvestmentOption (state, payload) {\r\n state.activeInvestmentOption = payload\r\n },\r\n setSunburstInvestments (state, payload) {\r\n state.sunburstInvestments = payload\r\n },\r\n incrementSunburstWalkthroughStep (state) {\r\n state.sunburstWalkthroughStep++\r\n },\r\n setSunburstSidebarInvestmentOptions (state, payload) {\r\n state.sideBarInvestmentOptions = payload\r\n },\r\n setActiveCategory (state, payload) {\r\n state.activeInvestmentsSearchCategory = payload\r\n },\r\n setActiveAssetClass (state, payload) {\r\n state.activeInvestmentsSearchAssetClass = payload\r\n },\r\n setActiveInvestmentsSearchId (state, payload) {\r\n state.activeInvestmentsSearchId = payload\r\n },\r\n setSideBarLevelClicked (state) {\r\n state.sideBarLevelClicked++\r\n },\r\n setSunburstTitle (state, payload) {\r\n state.sunburstTitle = payload\r\n },\r\n setIntroText (state, payload) {\r\n state.introText = payload\r\n },\r\n setIntroProxyText (state, payload) {\r\n state.introProxyText = payload\r\n },\r\n setStep1Title (state, payload) {\r\n state.step1Title = payload\r\n },\r\n setStep1Body (state, payload) {\r\n state.step1Body = payload\r\n },\r\n setStep2Title (state, payload) {\r\n state.step2Title = payload\r\n },\r\n setStep2Body (state, payload) {\r\n state.step2Body = payload\r\n },\r\n setStep3Title (state, payload) {\r\n state.step3Title = payload\r\n },\r\n setStep3Body (state, payload) {\r\n state.step3Body = payload\r\n },\r\n setStep4Title (state, payload) {\r\n state.step4Title = payload\r\n },\r\n setStep4Body (state, payload) {\r\n state.step4Body = payload\r\n },\r\n setStep5Title (state, payload) {\r\n state.step5Title = payload\r\n },\r\n setStep5Body (state, payload) {\r\n state.step5Body = payload\r\n }\r\n },\r\n actions: {\r\n setWalkthroughToken: ({ commit }) => {\r\n if (localStorage.getItem('showWalkthrough', 'value') !== 'shown') {\r\n localStorage.setItem('showWalkthrough', 'shown')\r\n commit('setWalkthroughToken', true)\r\n } else {\r\n commit('setWalkthroughToken', false)\r\n commit('setChartInteraction', true)\r\n }\r\n },\r\n fetchInvestments: ({ commit, state }, payload) => {\r\n axios.get(`${process.env.VUE_APP_API_INDUSTRIES_LIST}/${payload}`)\r\n .then(res => {\r\n const resData = res.data\r\n\r\n function flattenData (tree, flattened, level, parentId) {\r\n level = level || 0\r\n parentId = parentId || 'top'\r\n\r\n for (let i = 0; i < tree.length; i++) {\r\n let id = 0\r\n\r\n if (level === 0) {\r\n id = 'acc-'\r\n } else if (level === 1) {\r\n id = 'ac-'\r\n } else if (level === 2) {\r\n id = 'comp-'\r\n }\r\n id += tree[i].id\r\n\r\n if (level <= 1) {\r\n flattened.push({\r\n id: id,\r\n parent: parentId,\r\n name: tree[i].title,\r\n color: tree[i].colour,\r\n value: tree[i].value > 0 ? tree[i].value : 0,\r\n tooltipValue: tree[i].value,\r\n descriptorLink: tree[i].descriptorLink\r\n })\r\n } else {\r\n flattened.push({\r\n id: id,\r\n parent: parentId,\r\n name: tree[i].title,\r\n value: tree[i].value > 0 ? tree[i].value : 0,\r\n tooltipValue: tree[i].value,\r\n rating: tree[i].rating,\r\n topic: tree[i].topic,\r\n topicUrl: tree[i].topicUrl,\r\n topicUrlText: tree[i].topicUrlText\r\n })\r\n }\r\n\r\n if (typeof tree[i].subCategories !== 'undefined') {\r\n if (tree[i].subCategories.length > 0) {\r\n flattened = flattenData(tree[i].subCategories, flattened, level + 1, id)\r\n }\r\n } else if (typeof tree[i].companies !== 'undefined') {\r\n if (tree[i].companies.length > 0) {\r\n flattened = flattenData(tree[i].companies, flattened, level + 1, id)\r\n }\r\n }\r\n }\r\n return flattened\r\n }\r\n\r\n const flattened = []\r\n\r\n // set center circle for tree\r\n flattened.push({\r\n id: 'top',\r\n parent: '',\r\n name: state.activeInvestmentOption.title, // investment option\r\n value: null\r\n })\r\n\r\n flattenData(resData, flattened)\r\n\r\n console.log('flattened', flattened)\r\n\r\n commit('setSunburstInvestments', flattened)\r\n })\r\n },\r\n fetchInvestmentOptions: ({ commit }) => {\r\n axios.get(`${process.env.VUE_APP_API_INVESTMENT_OPTIONS}`)\r\n .then(res => {\r\n if (typeof window.sunburstData.investmentOptionId !== 'undefined') {\r\n const investmentOptions = res.data\r\n const activeInvestments = investmentOptions.filter(investment => investment.id === window.sunburstData.investmentOptionId)\r\n\r\n if (activeInvestments.length > 0) {\r\n commit('setActiveInvestmentOption', activeInvestments[0])\r\n }\r\n\r\n commit('setActiveInvestmentsId', window.sunburstData.investmentOptionId)\r\n commit('setSunburstSidebarInvestmentOptions', investmentOptions)\r\n }\r\n })\r\n },\r\n fetchInvestmentSearch: ({ commit, state }, payload) => {\r\n axios.get(`${process.env.VUE_APP_API_INDUSTRIES_SEARCH}/${state.activeInvestmentsId}/search/${payload}`)\r\n .then(res => {\r\n const resData = res.data\r\n\r\n function flatIndustriesSearchList (arr) {\r\n const industriesSearchList = []\r\n for (let i = 0; i < arr.length; i++) {\r\n if (Array.isArray(arr[i].subCategories)) {\r\n industriesSearchList.push(...flatIndustriesSearchList(arr[i].subCategories))\r\n } else if (Array.isArray(arr[i].companies)) {\r\n industriesSearchList.push(...flatIndustriesSearchList(arr[i].companies))\r\n } else {\r\n industriesSearchList.push(arr[i])\r\n }\r\n }\r\n return industriesSearchList\r\n }\r\n\r\n commit('setSideBarCompaniesSearch', flatIndustriesSearchList(resData))\r\n })\r\n },\r\n fetchSunburstVariables: ({ commit }) => {\r\n console.log('1. fetch variables')\r\n if (typeof window.sunburstData !== 'undefined') {\r\n if (typeof window.sunburstData.title !== 'undefined') {\r\n commit('setSunburstTitle', window.sunburstData.title)\r\n }\r\n if (typeof window.sunburstData.investmentOptionId !== 'undefined') {\r\n commit('setActiveInvestmentsId', window.sunburstData.investmentOptionId)\r\n }\r\n }\r\n },\r\n fetchIntroContent: ({ commit, state }, payload) => {\r\n axios.get(`${process.env.VUE_APP_API_DATAVIS_CONTENT}`)\r\n .then(res => {\r\n const resData = res.data\r\n commit('setIntroText', resData.IntroText)\r\n commit('setIntroProxyText', resData.ProxyVotingText)\r\n commit('setStep1Title', resData.Step1Title)\r\n commit('setStep1Body', resData.Step1Body)\r\n commit('setStep2Title', resData.Step2Title)\r\n commit('setStep2Body', resData.Step2Body)\r\n commit('setStep3Title', resData.Step3Title)\r\n commit('setStep3Body', resData.Step3Body)\r\n commit('setStep4Title', resData.Step4Title)\r\n commit('setStep4Body', resData.Step4Body)\r\n commit('setStep5Title', resData.Step5Title)\r\n commit('setStep5Body', resData.Step5Body)\r\n })\r\n },\r\n async fetchApis ({ state, dispatch }) {\r\n await dispatch('fetchInvestmentOptions')\r\n console.log('01. fetch investment options')\r\n await dispatch('fetchSunburstVariables')\r\n console.log('02. fetch sunburst variables')\r\n await dispatch('fetchInvestments', state.activeInvestmentsId)\r\n console.log('03. fetch investments', state.activeInvestmentsId)\r\n await dispatch('fetchIntroContent')\r\n }\r\n },\r\n modules: {\r\n }\r\n})\r\n","import 'dotenv/config'\r\nimport { createApp } from 'vue'\r\nimport App from './App.vue'\r\nimport store from './store'\r\n\r\nconst app = createApp(App)\r\n\r\nasync function initApp () {\r\n console.log('00. fetchApis')\r\n await store.dispatch('fetchApis')\r\n await store.dispatch('setWalkthroughToken')\r\n await app.use(store)\r\n await app.mount('#sunburst-app')\r\n}\r\n\r\ninitApp()\r\n","export * from \"-!../../node_modules/vue-style-loader/index.js??ref--9-oneOf-1-0!../../node_modules/css-loader/dist/cjs.js??ref--9-oneOf-1-1!../../node_modules/vue-loader-v16/dist/stylePostLoader.js!../../node_modules/postcss-loader/src/index.js??ref--9-oneOf-1-2!../../node_modules/postcss-loader/src/index.js??ref--9-oneOf-1-3!../../node_modules/sass-loader/dist/cjs.js??ref--9-oneOf-1-4!../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../node_modules/vue-loader-v16/dist/index.js??ref--1-1!./SunburstWalkthroughBackButton.vue?vue&type=style&index=0&id=411e8822&lang=scss&scoped=true\"","export * from \"-!../../node_modules/vue-style-loader/index.js??ref--9-oneOf-1-0!../../node_modules/css-loader/dist/cjs.js??ref--9-oneOf-1-1!../../node_modules/vue-loader-v16/dist/stylePostLoader.js!../../node_modules/postcss-loader/src/index.js??ref--9-oneOf-1-2!../../node_modules/postcss-loader/src/index.js??ref--9-oneOf-1-3!../../node_modules/sass-loader/dist/cjs.js??ref--9-oneOf-1-4!../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../node_modules/vue-loader-v16/dist/index.js??ref--1-1!./SunburstSidebarAssetClassSearch.vue?vue&type=style&index=0&id=bc1a2a7e&lang=scss&scoped=true\"","export * from \"-!../../node_modules/vue-style-loader/index.js??ref--9-oneOf-1-0!../../node_modules/css-loader/dist/cjs.js??ref--9-oneOf-1-1!../../node_modules/vue-loader-v16/dist/stylePostLoader.js!../../node_modules/postcss-loader/src/index.js??ref--9-oneOf-1-2!../../node_modules/postcss-loader/src/index.js??ref--9-oneOf-1-3!../../node_modules/sass-loader/dist/cjs.js??ref--9-oneOf-1-4!../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../node_modules/vue-loader-v16/dist/index.js??ref--1-1!./SunburstWalkthroughDesktop.vue?vue&type=style&index=0&id=fa8a64f0&lang=scss&scoped=true\"","export * from \"-!../../node_modules/vue-style-loader/index.js??ref--9-oneOf-1-0!../../node_modules/css-loader/dist/cjs.js??ref--9-oneOf-1-1!../../node_modules/vue-loader-v16/dist/stylePostLoader.js!../../node_modules/postcss-loader/src/index.js??ref--9-oneOf-1-2!../../node_modules/postcss-loader/src/index.js??ref--9-oneOf-1-3!../../node_modules/sass-loader/dist/cjs.js??ref--9-oneOf-1-4!../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../node_modules/vue-loader-v16/dist/index.js??ref--1-1!./SunburstSidebar.vue?vue&type=style&index=0&id=a0f80f16&lang=scss&scoped=true\"","module.exports = __webpack_public_path__ + \"img/icon-company.adb630d1.svg\";","// style-loader: Adds some css to the DOM by adding a
![\"arrow\"](\"@/assets/img/arrow-up.svg\")
\r\n ![\"arrow\"](\"@/assets/img/arrow-down.svg\")
\r\n ![](\"@/assets/img/icon-close.svg\"){kind=icon}
\r\n ![](\"@/assets/img/icon-close.svg\"/){kind=icon}
\r\n ![](\"@/assets/img/icon-search.svg\"/){kind=icon}
\r\n ![](\"@/assets/img/icon-company.svg\"/){kind=icon}
\r\n