{"id":15893236,"url":"https://github.com/liuhong1happy/react-raphael-chart","last_synced_at":"2025-03-20T12:34:17.593Z","repository":{"id":57343048,"uuid":"73681189","full_name":"liuhong1happy/react-raphael-chart","owner":"liuhong1happy","description":"so easy, create charts with react-raphael!","archived":false,"fork":false,"pushed_at":"2017-05-08T09:21:25.000Z","size":278,"stargazers_count":23,"open_issues_count":1,"forks_count":11,"subscribers_count":4,"default_branch":"master","last_synced_at":"2024-04-24T14:19:08.886Z","etag":null,"topics":["chart","raphael","react","react-raphael-chart"],"latest_commit_sha":null,"homepage":"https://liuhong1happy.github.io/react-raphael-chart","language":"JavaScript","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/liuhong1happy.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}},"created_at":"2016-11-14T08:02:00.000Z","updated_at":"2023-09-07T11:55:14.000Z","dependencies_parsed_at":"2022-09-17T06:21:23.458Z","dependency_job_id":null,"html_url":"https://github.com/liuhong1happy/react-raphael-chart","commit_stats":null,"previous_names":[],"tags_count":7,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/liuhong1happy%2Freact-raphael-chart","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/liuhong1happy%2Freact-raphael-chart/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/liuhong1happy%2Freact-raphael-chart/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/liuhong1happy%2Freact-raphael-chart/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/liuhong1happy","download_url":"https://codeload.github.com/liuhong1happy/react-raphael-chart/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":221766783,"owners_count":16877352,"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":["chart","raphael","react","react-raphael-chart"],"created_at":"2024-10-06T08:09:13.318Z","updated_at":"2024-10-28T02:21:42.069Z","avatar_url":"https://github.com/liuhong1happy.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# react-raphael-chart\n\n[![Version](https://img.shields.io/npm/v/react-raphael-chart.svg)](https://www.npmjs.com/package/react-raphael-chart)\n[![Downloads](https://img.shields.io/npm/dt/react-raphael-chart.svg)](https://www.npmjs.com/package/react-raphael-chart)\n\nso easy, create charts with react-raphael!\n\n## Install\n\n\t# or specify the externals in webpack config\n\tnpm install --save raphael\n\t# install react-raphael-chart in your react-raphael-chart project\n\tnpm install  --save react-raphael-chart\n\n## API\n\n#### PieChart\n\n**All props**\n\n- color `string` arc fill color of PieChart\n- background `string` background fill color of PieChart\n- radius `number` radius of PieChart's circle\n- center `object` radius of PieChart's circle\n- label `number` text of PieChart's label\n- fontsize `object` fontsize of PieChart's label\n- total `string` total of PieChart's data\n- value `number` value of PieChart's data\n- width `number` width of PieChart\n- height `number` width of PieChart\n- style `object` style of PieChart's container\n- className `string` className of PieChart's container\n- animate `boolean` animation of PieChart\n- repeat `boolean` repeat the animation\n\n#### DoughnutChart\n\n**All props**\n\n- color `string` arc fill color of DoughnutChart\n- background `string` background fill color of DoughnutChart\n- radius `number` radius of DoughnutChart's circle\n- center `object` radius of DoughnutChart's circle\n- thinckness `number` thinckness of DoughnutChart's circle\n- label `number` text of DoughnutChart's label\n- fontsize `object` fontsize of DoughnutChart's label\n- total `string` total of DoughnutChart's data\n- value `number` value of DoughnutChart's data\n- width `number` width of DoughnutChart\n- height `number` width of DoughnutChart\n- style `object` style of DoughnutChart's container\n- className `string` className of DoughnutChart's container\n- animate `boolean` animation of DoughnutChart\n- repeat `boolean` repeat the animation\n\n#### LineChart ( VoronoiLineChart )\n\n- width `number` width of LineChart\n- height `number` width of LineChart\n- serises `array` serises of LineChart\n\t- data `array` data of LineChart's serise\n\t\t- x `number` x of LineChart's serise data\n\t\t- y `number` x of LineChart's serise data\n\t- color `string` color of LineChart's serise\n\t- thickness `number` thickness of LineChart's serise\n\t- curve `boolean` curve of LineChart's serise\n- xAxis `object` xAxis of LineChart\n\t- min `number` min value of xAxis\n\t- max `number` max value of xAxis\n\t- interval `number` interval value of xAxis\n\t- formatter `function` title formatter of xAxis `{ data: object }`\n\t- height `number` height of xAxis\n- yAxis `object` yAxis of LineChart\n\t- min `number` min value of yAxis\n\t- max `number` max value of yAxis\n\t- interval `number` interval value of yAxis\n\t- formatter `function` title formatter of yAxis `{ data: object }`\n\t- width `number` width of yAxis\n- grid `object` grid of LineChart\n\t- color `string` color of LineChart's grid\n\t- thickness `number` thickness of LineChart's serise\n\t- showYGrid `boolean` show y axis grid of LineChart\n\t- showXGrid `boolean` show y axis grid of LineChart\n- animate `boolean` animation of LineChart\n- repeat `boolean` repeat the LineChart\n\n#### BarChart\n\n- width `number` width of BarChart\n- height `number` width of BarChart\n- serises `array` serises of BarChart\n\t- data `array` data of BarChart's serise\n\t\t- x `number` x of BarChart's serise data\n\t\t- y `number` x of BarChart's serise data\n\t- color `string` color of BarChart's serise\n\t- hoverColor `string` hover color of BarChart's serise\n- xAxis `object` xAxis of BarChart\n\t- min `number` min value of xAxis\n\t- max `number` max value of xAxis\n\t- interval `number` interval value of xAxis\n\t- formatter `function` title formatter of xAxis `{ data: object }`\n\t- height `number` height of xAxis\n- yAxis `object` yAxis of BarChart\n\t- min `number` min value of yAxis\n\t- max `number` max value of yAxis\n\t- interval `number` interval value of yAxis\n\t- formatter `function` title formatter of yAxis `{ data: object }`\n\t- width `number` width of yAxis\n- grid `object` grid of BarChart\n\t- color `string` color of BarChart's grid\n\t- thickness `number` thickness of BarChart's serise\n\t- showYGrid `boolean` show y axis grid of BarChart\n\t- showXGrid `boolean` show y axis grid of BarChart\n- barWidth `number` max width of BarChart's bar\n- fontSize `number` font size of BarChart's text\n- textAutoHide  `boolean` auto hide of BarChart's text\n\n\n## Develop\n\n1. clone the repository\n\n        git clone https://github.com/liuhong1happy/react-raphael-chart.git\n    \n2. install dependency package;\n\n        npm install \n\n3. run example\n\n        npm run example\n        \n4. build\n\n        npm run build\n        \n## Use\n\nNow , you can see [example](example/index.js) !\n\n\n# Contact\n\nEmail: [liuhong1.happy@163.com](mailto:liuhong1.happy@163.com)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fliuhong1happy%2Freact-raphael-chart","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fliuhong1happy%2Freact-raphael-chart","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fliuhong1happy%2Freact-raphael-chart/lists"}