We read every piece of feedback, and take your input very seriously.
To see all available qualifiers, see our documentation.
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
this.xaxisTooltip is null
Will you help me? How can I ensure that this.xaxisTooltip is never null?
this.xaxisTooltip
I tried to play with the chartOptions but I can't seem to be able to ensure it gets initialized or disable it completely.
chartOptions
I'm working with Vue 3 and Ionic.
I implemented the example provided for the Area Chart; however, there are times when this shows up:
this.xaxisTooltip is null value@webpack-internal:///./node_modules/apexcharts/dist/apexcharts.common.js:6:284680 value@webpack-internal:///./node_modules/apexcharts/dist/apexcharts.common.js:6:280529 value@webpack-internal:///./node_modules/apexcharts/dist/apexcharts.common.js:6:280054 value@webpack-internal:///./node_modules/apexcharts/dist/apexcharts.common.js:6:279503 value@webpack-internal:///./node_modules/apexcharts/dist/apexcharts.common.js:6:278748 EventListener.handleEvent*a/<@webpack-internal:///./node_modules/apexcharts/dist/apexcharts.common.js:6:278552 a@webpack-internal:///./node_modules/apexcharts/dist/apexcharts.common.js:6:278523 value@webpack-internal:///./node_modules/apexcharts/dist/apexcharts.common.js:6:278646 value@webpack-internal:///./node_modules/apexcharts/dist/apexcharts.common.js:6:276956 value@webpack-internal:///./node_modules/apexcharts/dist/apexcharts.common.js:6:274525 value/<@webpack-internal:///./node_modules/apexcharts/dist/apexcharts.common.js:15:39460 value@webpack-internal:///./node_modules/apexcharts/dist/apexcharts.common.js:15:38173 value/<@webpack-internal:///./node_modules/apexcharts/dist/apexcharts.common.js:15:36157 value@webpack-internal:///./node_modules/apexcharts/dist/apexcharts.common.js:15:21677 init@webpack-internal:///./node_modules/vue3-apexcharts/dist/vue3-apexcharts.common.js:354:26 async*setup/<@webpack-internal:///./node_modules/vue3-apexcharts/dist/vue3-apexcharts.common.js:440:7 createHook/</<@webpack-internal:///./node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.js:2811:92 callWithErrorHandling@webpack-internal:///./node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.js:296:18 callWithAsyncErrorHandling@webpack-internal:///./node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.js:304:38 injectHook/hook.__weh@webpack-internal:///./node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.js:2791:45 flushPostFlushCbs@webpack-internal:///./node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.js:461:41 flushJobs@webpack-internal:///./node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.js:499:22 promise callback*queueFlush@webpack-internal:///./node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.js:406:43 queueJob@webpack-internal:///./node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.js:400:5 scheduler@webpack-internal:///./node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.js:1914:31 triggerEffect@webpack-internal:///./node_modules/@vue/reactivity/dist/reactivity.esm-bundler.js:408:15 triggerEffects@webpack-internal:///./node_modules/@vue/reactivity/dist/reactivity.esm-bundler.js:398:20 triggerRefValue@webpack-internal:///./node_modules/@vue/reactivity/dist/reactivity.esm-bundler.js:1007:21 ComputedRefImpl/this.effect<@webpack-internal:///./node_modules/@vue/reactivity/dist/reactivity.esm-bundler.js:1166:24 triggerEffect@webpack-internal:///./node_modules/@vue/reactivity/dist/reactivity.esm-bundler.js:408:15 triggerEffects@webpack-internal:///./node_modules/@vue/reactivity/dist/reactivity.esm-bundler.js:393:20 triggerRefValue@webpack-internal:///./node_modules/@vue/reactivity/dist/reactivity.esm-bundler.js:1007:21 ComputedRefImpl/this.effect<@webpack-internal:///./node_modules/@vue/reactivity/dist/reactivity.esm-bundler.js:1166:24 triggerEffect@webpack-internal:///./node_modules/@vue/reactivity/dist/reactivity.esm-bundler.js:408:15 triggerEffects@webpack-internal:///./node_modules/@vue/reactivity/dist/reactivity.esm-bundler.js:393:20 triggerRefValue@webpack-internal:///./node_modules/@vue/reactivity/dist/reactivity.esm-bundler.js:1007:21 set value@webpack-internal:///./node_modules/@vue/reactivity/dist/reactivity.esm-bundler.js:1049:22 finalizeNavigation@webpack-internal:///./node_modules/vue-router/dist/vue-router.mjs:3376:9 pushWithRedirect/<@webpack-internal:///./node_modules/vue-router/dist/vue-router.mjs:3241:27 promise callback*pushWithRedirect@webpack-internal:///./node_modules/vue-router/dist/vue-router.mjs:3208:14 push@webpack-internal:///./node_modules/vue-router/dist/vue-router.mjs:3133:16 handleNavigate@webpack-internal:///./node_modules/@ionic/vue-router/dist/index.js:404:20 changeTab@webpack-internal:///./node_modules/@ionic/vue-router/dist/index.js:691:27 onClick@webpack-internal:///./node_modules/@ionic/vue/dist/index.js:1768:27 callWithErrorHandling@webpack-internal:///./node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.js:296:18 ERROR this.xaxisTooltip is null value@webpack-internal:///./node_modules/apexcharts/dist/apexcharts.common.js:6:284680 value@webpack-internal:///./node_modules/apexcharts/dist/apexcharts.common.js:6:280529 value@webpack-internal:///./node_modules/apexcharts/dist/apexcharts.common.js:6:280054 value@webpack-internal:///./node_modules/apexcharts/dist/apexcharts.common.js:6:279503 value/this.seriesHoverTimeout<@webpack-internal:///./node_modules/apexcharts/dist/apexcharts.common.js:6:278853 setTimeout handler*value@webpack-internal:///./node_modules/apexcharts/dist/apexcharts.common.js:6:278828 EventListener.handleEvent*a/<@webpack-internal:///./node_modules/apexcharts/dist/apexcharts.common.js:6:278552 a@webpack-internal:///./node_modules/apexcharts/dist/apexcharts.common.js:6:278523 value@webpack-internal:///./node_modules/apexcharts/dist/apexcharts.common.js:6:278646 value@webpack-internal:///./node_modules/apexcharts/dist/apexcharts.common.js:6:276956 value@webpack-internal:///./node_modules/apexcharts/dist/apexcharts.common.js:6:274525 value/<@webpack-internal:///./node_modules/apexcharts/dist/apexcharts.common.js:15:39460 value@webpack-internal:///./node_modules/apexcharts/dist/apexcharts.common.js:15:38173 value/<@webpack-internal:///./node_modules/apexcharts/dist/apexcharts.common.js:15:36157 value@webpack-internal:///./node_modules/apexcharts/dist/apexcharts.common.js:15:21677 init@webpack-internal:///./node_modules/vue3-apexcharts/dist/vue3-apexcharts.common.js:354:26 async*setup/<@webpack-internal:///./node_modules/vue3-apexcharts/dist/vue3-apexcharts.common.js:440:7 createHook/</<@webpack-internal:///./node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.js:2811:92 callWithErrorHandling@webpack-internal:///./node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.js:296:18 callWithAsyncErrorHandling@webpack-internal:///./node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.js:304:38 injectHook/hook.__weh@webpack-internal:///./node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.js:2791:45 flushPostFlushCbs@webpack-internal:///./node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.js:461:41 flushJobs@webpack-internal:///./node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.js:499:22 promise callback*queueFlush@webpack-internal:///./node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.js:406:43 queueJob@webpack-internal:///./node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.js:400:5 scheduler@webpack-internal:///./node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.js:1914:31 triggerEffect@webpack-internal:///./node_modules/@vue/reactivity/dist/reactivity.esm-bundler.js:408:15 triggerEffects@webpack-internal:///./node_modules/@vue/reactivity/dist/reactivity.esm-bundler.js:398:20 triggerRefValue@webpack-internal:///./node_modules/@vue/reactivity/dist/reactivity.esm-bundler.js:1007:21 ComputedRefImpl/this.effect<@webpack-internal:///./node_modules/@vue/reactivity/dist/reactivity.esm-bundler.js:1166:24 triggerEffect@webpack-internal:///./node_modules/@vue/reactivity/dist/reactivity.esm-bundler.js:408:15 triggerEffects@webpack-internal:///./node_modules/@vue/reactivity/dist/reactivity.esm-bundler.js:393:20 triggerRefValue@webpack-internal:///./node_modules/@vue/reactivity/dist/reactivity.esm-bundler.js:1007:21 ComputedRefImpl/this.effect<@webpack-internal:///./node_modules/@vue/reactivity/dist/reactivity.esm-bundler.js:1166:24 triggerEffect@webpack-internal:///./node_modules/@vue/reactivity/dist/reactivity.esm-bundler.js:408:15 triggerEffects@webpack-internal:///./node_modules/@vue/reactivity/dist/reactivity.esm-bundler.js:393:20 triggerRefValue@webpack-internal:///./node_modules/@vue/reactivity/dist/reactivity.esm-bundler.js:1007:21 set value@webpack-internal:///./node_modules/@vue/reactivity/dist/reactivity.esm-bundler.js:1049:22 finalizeNavigation@webpack-internal:///./node_modules/vue-router/dist/vue-router.mjs:3376:9 pushWithRedirect/<@webpack-internal:///./node_modules/vue-router/dist/vue-router.mjs:3241:27 promise callback*pushWithRedirect@webpack-internal:///./node_modules/vue-router/dist/vue-router.mjs:3208:14 push@webpack-internal:///./node_modules/vue-router/dist/vue-router.mjs:3133:16 handleNavigate@webpack-internal:///./node_modules/@ionic/vue-router/dist/index.js:404:20 changeTab@webpack-internal:///./node_modules/@ionic/vue-router/dist/index.js:691:27 onClick@webpack-internal:///./node_modules/@ionic/vue/dist/index.js:1768:27 callWithErrorHandling@webpack-internal:///./node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.js:296:18
Which tells me that something, sometimes, fails to be initialized correctly or it is initialized in the wrong order.
This is the data:
data: function () { return { series: [{ data: [ [1327359600000, 30.95], ] }], chartOptions: { chart: { id: 'area-datetime', type: 'area', height: 350, zoom: { autoScaleYaxis: true } }, annotations: { yaxis: [{ y: 30, borderColor: '#999', label: { show: true, text: 'Support', style: { color: "#fff", background: '#00E396' } } }], xaxis: [{ x: new Date('14 Nov 2012').getTime(), borderColor: '#999', yAxisIndex: 0, label: { show: true, text: 'Rally', style: { color: "#fff", background: '#775DD0' } }, tooltip: { enabled: false } }] }, dataLabels: { enabled: false }, markers: { size: 0, style: 'hollow', }, xaxis: { type: 'datetime', min: Date.now() - 1000,//new Date('01 Mar 2012').getTime(), tickAmount: 6, }, tooltip: { x: { format: 'dd MMM yyyy' } }, fill: { type: 'gradient', gradient: { shadeIntensity: 1, opacityFrom: 0.7, opacityTo: 0.9, stops: [0, 100] } }, }, selection: 'one_year', } }, ``` Thank you for your time.
The text was updated successfully, but these errors were encountered:
No branches or pull requests
Will you help me? How can I ensure that
this.xaxisTooltip
is never null?I tried to play with the
chartOptions
but I can't seem to be able to ensure it gets initialized or disable it completely.I'm working with Vue 3 and Ionic.
I implemented the example provided for the Area Chart; however, there are times when this shows up:
Which tells me that something, sometimes, fails to be initialized correctly or it is initialized in the wrong order.
This is the data:
The text was updated successfully, but these errors were encountered: