ChartPieJS

A simple and flexible pie chart library for JavaScript and React, created by Varol Cagdas Tok.

Installation

You can install ChartPieJS via npm:

npm install chartpiejs

Usage

In a JavaScript project, you can use ChartPieJS as follows:

import { PieChart } from "chartpiejs";

const canvas = document.getElementById("your-canvas-id");
const pieChart = new PieChart({
  canvas: canvas,
  enableHover: true,
  enableNames: true,
});

pieChart.addDataSet({ data: 25, color: "red", name: "Red Segment" });
pieChart.addDataSet({ data: 30, color: "blue", name: "Blue Segment" });
pieChart.addDataSet({ data: 45, color: "green", name: "Green Segment" });

pieChart.draw();

React Usage

To use ChartPieJS in a React application, you can integrate it like this:

import React from "react";
import ReactPieChart from "chartpiejs";

const dataSets = [
  { data: 25, color: "red", name: "Red Segment" },
  { data: 30, color: "blue", name: "Blue Segment" },
  { data: 45, color: "green", name: "Green Segment" },
];

const App = () => {
  return (
    <div>
      <h1>My Pie Chart</h1>
      <ReactPieChart dataSets={dataSets} />
    </div>
  );
};

export default App;

Features

• Easy to integrate with JavaScript and React projects.
• Supports interactive hover effects.
• Allows displaying names inside the pie chart segments.
• Configurable font size and family for segment names.

Author

• Varol Cagdas Tok

License

MIT