Vue Funnel - Array Only

To bind the Funnel to an array, pass this array to the dataSource property. The array should contain objects.

App.vue
  • <template>
  • <DxFunnel
  • :data-source="fruits"
  • argument-field="fruit"
  • value-field="count"
  • />
  • </template>
  •  
  • <script>
  • import DxFunnel from 'devextreme-vue/funnel';
  •  
  • export default {
  • components: {
  • DxFunnel
  • },
  • data() {
  • return {
  • fruits: [
  • { fruit: 'Apples', count: 10 },
  • { fruit: 'Oranges', count: 12 },
  • { fruit: 'Lemons', count: 15 },
  • { fruit: 'Pears', count: 20 },
  • { fruit: 'Pineapples', count: 3 }
  • ]
  • }
  • }
  • }
  • </script>
See Also