{"id":18556753,"url":"https://github.com/coreui/coreui-vue-chartjs","last_synced_at":"2025-11-03T14:03:40.888Z","repository":{"id":37790252,"uuid":"180335785","full_name":"coreui/coreui-vue-chartjs","owner":"coreui","description":"CoreUI Vue Chart.js http://coreui.io","archived":false,"fork":false,"pushed_at":"2024-03-28T15:34:12.000Z","size":3144,"stargazers_count":15,"open_issues_count":27,"forks_count":3,"subscribers_count":4,"default_branch":"main","last_synced_at":"2024-05-21T18:32:26.106Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/coreui.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null}},"created_at":"2019-04-09T09:46:55.000Z","updated_at":"2023-07-18T11:56:18.000Z","dependencies_parsed_at":"2024-04-13T20:03:29.157Z","dependency_job_id":null,"html_url":"https://github.com/coreui/coreui-vue-chartjs","commit_stats":{"total_commits":64,"total_committers":5,"mean_commits":12.8,"dds":0.484375,"last_synced_commit":"a3a42cabd2b34dd1b1b78cbb72d5e6cdc41ba5cd"},"previous_names":[],"tags_count":12,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/coreui%2Fcoreui-vue-chartjs","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/coreui%2Fcoreui-vue-chartjs/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/coreui%2Fcoreui-vue-chartjs/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/coreui%2Fcoreui-vue-chartjs/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/coreui","download_url":"https://codeload.github.com/coreui/coreui-vue-chartjs/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248140367,"owners_count":21054287,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-11-06T21:33:10.542Z","updated_at":"2025-11-03T14:03:35.862Z","avatar_url":"https://github.com/coreui.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003cp align=\"center\"\u003e\n  \u003ca href=\"https://coreui.io/\"\u003e\n    \u003cimg\n      src=\"https://coreui.io/images/brand/coreui-signet.svg\"\n      alt=\"CoreUI logo\"\n      width=\"200\"\n    /\u003e\n  \u003c/a\u003e\n\u003c/p\u003e\n\n\u003ch3 align=\"center\"\u003eCoreUI Vue.js wrapper for Chart.js\u003c/h3\u003e\n\n\u003cp align=\"center\"\u003e\n  \u003ca href=\"https://coreui.io/vue/docs/components/chart/\"\u003e\u003cstrong\u003eExplore @coreui/vue-chartjs docs \u0026 examples »\u003c/strong\u003e\u003c/a\u003e\n  \u003cbr\u003e\n  \u003cbr\u003e\n  \u003ca href=\"https://github.com/coreui/coreui-vue/issues/new?template=bug_report.md\"\u003eReport bug\u003c/a\u003e\n  ·\n  \u003ca href=\"https://github.com/coreui/coreui-vue/issues/new?template=feature_request.md\"\u003eRequest feature\u003c/a\u003e\n  ·\n  \u003ca href=\"https://blog.coreui.io/\"\u003eBlog\u003c/a\u003e\n\u003c/p\u003e\n\n## Status\n\n[![npm package][npm-badge]][npm]\n[![NPM downloads][npm-download]][npm]\n\n[npm-badge]: https://img.shields.io/npm/v/@coreui/vue-chartjs/latest?style=flat-square\n[npm]: https://www.npmjs.com/package/@coreui/vue-chartjs\n[npm-download]: https://img.shields.io/npm/dm/@coreui/vue-chartjs.svg?style=flat-square\n\n##### install:\n\n```bash\nnpm install @coreui/vue-chartjs\n\n# or\n\nyarn add @coreui/vue-chartjs\n```\n\n##### import:\n\n```jsx\nimport { CChart } from '@coreui/vue-chartjs'\n```\n\nor\n\n```js\nimport {\n  CChart,\n  CChartBar,\n  CChartHorizontalBar,\n  CChartLine,\n  CChartDoughnut,\n  CChartRadar,\n  CChartPie,\n  CChartPolarArea,\n} from '@coreui/vue-chartjs'\n```\n\n##### props:\n\n```js\n/**\n * Enables custom html based tooltips instead of standard tooltips.\n *\n * @default true\n */\ncustomTooltips: {\n  type: Boolean,\n  default: true,\n  required: false,\n},\n/**\n * The data object that is passed into the Chart.js chart (more info).\n */\ndata: {\n  type: [Object, Function] as PropType\u003cChartData | ((canvas: HTMLCanvasElement) =\u003e ChartData)\u003e,\n  required: true,\n},\n/**\n * Height attribute applied to the rendered canvas.\n *\n * @default 150\n */\nheight: {\n  type: Number,\n  default: 150,\n  required: false,\n},\n/**\n * ID attribute applied to the rendered canvas.\n */\nid: {\n  type: String,\n  default: undefined,\n  required: false,\n},\n/**\n * The options object that is passed into the Chart.js chart.\n *\n * {@link https://www.chartjs.org/docs/latest/general/options.html More Info}\n */\noptions: {\n  type: Object as PropType\u003cChartOptions\u003e,\n  default: undefined,\n  required: false,\n},\n/**\n * The plugins array that is passed into the Chart.js chart (more info)\n *\n * {@link https://www.chartjs.org/docs/latest/developers/plugins.html More Info}\n */\nplugins: {\n  type: Array as PropType\u003cPlugin[]\u003e,\n  default: undefined,\n},\n/**\n * If true, will tear down and redraw chart on all updates.\n */\nredraw: Boolean,\n/**\n * Chart.js chart type.\n *\n * @type {'line' | 'bar' | 'radar' | 'doughnut' | 'polarArea' | 'bubble' | 'pie' | 'scatter'}\n */\ntype: {\n  type: String as PropType\u003cChartType\u003e,\n  default: 'bar',\n  required: false,\n},\n/**\n * Width attribute applied to the rendered canvas.\n *\n * @default 300\n */\nwidth: {\n  type: Number,\n  default: 300,\n  required: false,\n},\n/**\n * Put the chart into the wrapper div element.\n *\n * @default true\n */\nwrapper: {\n  type: Boolean,\n  default: true,\n  required: false,\n},\n```\n\n##### usage:\n\n```vue\n\u003cCChartLine\n  :wrapper=\"false\"\n  :data=\"{\n    labels: ['January', 'February', 'March', 'April', 'May', 'June', 'July'],\n    datasets: [\n      {\n        label: 'My First dataset',\n        backgroundColor: 'rgba(220, 220, 220, 0.2)',\n        borderColor: 'rgba(220, 220, 220, 1)',\n        pointBackgroundColor: 'rgba(220, 220, 220, 1)',\n        pointBorderColor: '#fff',\n        data: [40, 20, 12, 39, 10, 40, 39]\n      },\n      {\n        label: 'My Second dataset',\n        backgroundColor: 'rgba(151, 187, 205, 0.2)',\n        borderColor: 'rgba(151, 187, 205, 1)',\n        pointBackgroundColor: 'rgba(151, 187, 205, 1)',\n        pointBorderColor: '#fff',\n        data: [50, 12, 28, 29, 7, 25, 12]\n      }\n    ]\n  }\"\n/\u003e\n```","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcoreui%2Fcoreui-vue-chartjs","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fcoreui%2Fcoreui-vue-chartjs","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcoreui%2Fcoreui-vue-chartjs/lists"}