Vue.js - load 2 pie charts using the same .vue component
Budget: $30 – $250 USD
Using the constraints below, load 2 pie charts using the same .vue component - have them draw and redraw as the data changes
Constraints:
* Vue 2.6.12
* Chart.js 2.9.4
* Vue.chart.js 3.5.1
Files - 2 files that load 1 pie chart successfully already, but will not load a 2nd if loading data to it
* chartcontainer.vue
* piechart.js
app.vue instantiation code - I use the following in template to load this container. I create a 2nd copy of this with different variables to load another copy. However, the 2nd copy of the object seems to be ignored by vue. I got a 2nd pie chart to work by drawing it raw in app.vue with <canvas> but I would like to componentize.
<chartcontainer chartType="Pie" chartkey="holdingChart" title="Holdings" :coinList="this.pieCoinList" :bgList="this.pieBgList" :borderColor="this.pieBorderColorList" v-bind:chartData="this.pieChartData" />
User acceptance criteria:
* Use the 2 files or subset of those 2 files to meet the overall objective of loading 2 pie charts with the same .vue component.
* Must be reactive pie charts
* Must be able to work within the main solution - able to be retrofitted. This is fine if the pattern is mostly the same of accepting bound data from app.vue.
Constraints:
* Vue 2.6.12
* Chart.js 2.9.4
* Vue.chart.js 3.5.1
Files - 2 files that load 1 pie chart successfully already, but will not load a 2nd if loading data to it
* chartcontainer.vue
* piechart.js
app.vue instantiation code - I use the following in template to load this container. I create a 2nd copy of this with different variables to load another copy. However, the 2nd copy of the object seems to be ignored by vue. I got a 2nd pie chart to work by drawing it raw in app.vue with <canvas> but I would like to componentize.
<chartcontainer chartType="Pie" chartkey="holdingChart" title="Holdings" :coinList="this.pieCoinList" :bgList="this.pieBgList" :borderColor="this.pieBorderColorList" v-bind:chartData="this.pieChartData" />
User acceptance criteria:
* Use the 2 files or subset of those 2 files to meet the overall objective of loading 2 pie charts with the same .vue component.
* Must be reactive pie charts
* Must be able to work within the main solution - able to be retrofitted. This is fine if the pattern is mostly the same of accepting bound data from app.vue.