C3.js | D3-based reusable chart library Getting Started Examples Reference Forum Source # Chart Line Chart Line chart with sequential data. View details » Timeseries Chart Simple line chart with timeseries data. View details » Spline Chart Display as Spline Chart. View details » Simple XY Line Chart Simple line chart with custom x. View details » Multiple XY Line Chart Multiple line chart with multiple custom x. View details » Line Chart with Regions Set regions for each data with style. View details » Step Chart Display as Step Chart. View details » Area Chart Display as Area Chart. View details » Stacked Area Chart Display as Stacked Area Chart. View details » Bar Chart Display as Bar Chart. View details » Stacked Bar Chart Display as Stacked Bar Chart. View details » Scatter Plot Display as Scatter Plot. View details » Pie Chart Display as Pie Chart. View details » Donut Chart Display as Donut Chart. View details » Gauge Chart Display as Gauge Chart. View details » Combination Chart Display all kinda charts up in here. View details » # Axis Category Axis Show ticks as categorized by each data. View details » Rotated Axis Switch x and y axis position. View details » Additional Y Axis Additional y axis can be added. View details » X Axis Tick Format Format x axis tick text. View details » X Axis Tick Count Set the number of ticks on X Axis. View details » X Axis Tick Values Set tick texts on X Axis. View details » X Axis Tick Culling Set cull ticks or not on X Axis. View details » X Axis Tick Fitting Set ticks position to x of data. View details » X Axis Timezone Convert time to UTC. View details » Rotate X Axis Tick Text Rotate x axis tick text. View details » Y Axis Tick Format Format y axis tick text. View details » Padding for Y Axis Set padding for y axis. View details » Range for Y Axis Set range for y axis. View details » Axis Label Set label for axis. View details » Axis Label Position Set axis label position. View details » # Data Column Oriented Data Column-oriented data can be used as input. View details » Row Oriented Data Row-oriented data can be used as input. View details » JSON Data JSON can be used as input. View details » Data from URL Data from URL can be used as input. View details » Category Data Load data with x values on category axis. View details » Load Data Load data dynamically. View details » Data Name Set name for each data. View details » Data Color Set color according to data. View details » Data Order Define data order. This will be used for stacked bar chart. View details » Data Label Show label of data. View details » Data Label Format Format label of data. View details » Number Format Localization Number format localization using D3 locale settings. View details » # Grid Grid Lines Show grid lines for x and y axis. View details » Optional X Grid Lines Add optional grid lines on x grid. View details » Optional Y Grid Lines Add optional grid lines on y grid. View details » # Region Region Show rects on chart. View details » Region with Timeseries Show rects on timeseries chart. View details » # Interaction Sub Chart Show sub chart for zoom and selection range. View details » Zoom Zoom by mouse wheel event and slide by drag. View details » # Legend Hide Legend Set visibility of legend. View details » Legend Position Show legend on bottom or right side. View details » Custom Legend Build custom legend View details » # Tooltip Hide Tooltip Set visibility of tooltip. View details » Tooltip Grouping Show tooltips as grouped or not. View details » Tooltip Format Set format for title and value on tooltip. View details » # Chart Options Chart Size Set chart size in px. View details » Padding Change padding for the chart. View details » Color Pattern Set custom color pattern. View details » Duration of Transition Set duration of transition for chart animation. View details » # Line Chart Options Hide points Hide points on line chart View details » # Pie Chart Options Pie Label Format Change label format on Pie chart View details » # API Flow Load/Unload data as flowing View details » Data Name Update data names. View details » Data Color Update data colors. View details » Axis Label Update axis labels. View details » Axis Range Update axis range. View details » Resize Resize chart. View details » X Grid Update custom x grids. View details » # Transform To Line Chart Transform to line chart. View details » To Spline Chart Transform to spline chart. View details » To Bar Chart Transform to bar chart. View details » To Area Chart Transform to area chart. View details » To Area Spline Chart Transform to area spline chart. View details » To Scatter Plot Transform to scatter plot. View details » To Pie Chart Transform to pie chart. View details » To Donut Chart Transform to donut chart. View details » # Style Style for Region Set style for regions. View details » Style for Grid Set style for grids. View details » © Masayuki Tanaka 2014