Apexchart vue type Donut

Hi, im try to use other types of apexcharts, im looking apexcharts vue home page,
but not work!

I cant see donut type.
can please tell me how i can add other type of apexchart





Thanks lot
Have a great day!!

metronic8 vue
Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(

Replies (9)

Hi,

All types of the apexcharts must work, could you please please attach the code which you are using?
HI Lauris

I use this code





Can you see my code?, when publish i cant see code i paste
No, I can't see it.

Please check Text formatting options to format your code correctly.
<div >
<apexchart type="donut" :options="chartOptions" :series="series"></apexchart>
</div>

Do you have any errors in your browser console?
Im using this sample

https://apexcharts.com/vue-chart-demos/pie-charts/simple-donut/
Just tried this example in the latest Metronic version and it works fine.

<apexchart
type="donut"
:options="chartOptions"
:series="series"
></apexchart>



data: function () {
return {
series: [44, 55, 41, 17, 15],
chartOptions: {
chart: {
type: "donut",
},
responsive: [
{
breakpoint: 480,
options: {
chart: {
width: 200,
},
legend: {
position: "bottom",
},
},
},
],
},
};
},

I will try!! thanks

Have a great day!!

sorry my bad english!!
Great happy I will close this case for now if you will have any questions leave a comment below and the case status will be changed to unresolved automatically.

Thank you!
Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(
Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(

React Dev Vacancy

KeenThemes is looking for a Junior React or Vue developer to build awesome apps.
Apply
keenthemes mega bundle