# C – Control Chart Online Calculator

• /
• Blog
• /
• C – Control Chart Online Calculator

C control charts are a valuable tool for monitoring the number of defects in a process. They help identify trends and variations in the process, which can lead to improved quality and efficiency. In this blog post, we will walk you through the process of creating a simple web app for generating C control charts, similar to our previous post on I-MR control charts.

## What is a C Control Chart?

A C control chart is a statistical tool used to monitor the number of defects in a process over time. The C chart plots the count of defects in each sample on the y-axis, while the x-axis represents the sample number. The chart also includes a center line, which is the average count of defects, as well as upper and lower control limits (UCL and LCL) that indicate the expected range of variation in the process.

## Formula Used:

In C control charts, the center line (CL) represents the average count of defects per sample. The upper control limit (UCL) and lower control limit (LCL) are calculated based on the average count of defects and the number of samples (n) using the following formulas:

• CL = Σ(count of defects per sample) / n
• UCL = CL + 3 * √CL
• LCL = CL - 3 * √CL (if LCL < 0, set LCL to 0)

## How to Use the App:

To use the C control chart web app, follow these simple steps:

1. Prepare your data in Excel, with a single column containing the count of defects per sample (including a header).
2. Copy the data from Excel and paste it into the text area labeled "Paste Excel data (single column with header)" in the web app.
3. Click the "Draw C Chart" button.
4. The C control chart will be generated below the input form, displaying the count of defects per sample, along with the center line, UCL, and LCL.

The chart will help you visualize the process stability and detect any unusual patterns or trends. If any data points fall outside the control limits, it may indicate that the process is out of control and requires further investigation.

### C Control Chart

``` function processData(textData) { const lines = textData.trim().split('\n'); const data = lines.slice(1).map(line => parseFloat(line)); return { header: lines[0], data: data }; } function drawCChart() { const textData = document.getElementById('data-input').value; const { header, data } = processData(textData); const centerLine = data.reduce((acc, val) => acc + val, 0) / data.length; const ucl = centerLine + 3 * Math.sqrt(centerLine); const lcl = Math.max(centerLine - 3 * Math.sqrt(centerLine), 0); drawChart(header, data, centerLine, ucl, lcl); document.getElementById('c-chart-stats').innerHTML = `C Chart - Mean: \${centerLine.toFixed(2)}, UCL: \${ucl.toFixed(2)}, LCL: \${lcl.toFixed(2)}`; } function drawChart(header, data, centerLine, ucl, lcl) { const traceWithin = { x: data.map((_, index) => index + 1), y: data, mode: 'lines+markers', name: 'Data', marker: { color: 'blue', size: 8 }, line: { color: 'blue' }, showlegend: false }; const traceOutside = { x: data.map((value, index) => (value > ucl || value < lcl) ? index + 1 : null), y: data.map(value => (value > ucl || value < lcl) ? value : null), mode: 'markers', name: 'Out of control', marker: { color: 'red', size: 8, symbol: 'square' } }; const traceCenterLine = { x: [0, data.length], y: [centerLine, centerLine], mode: 'lines', name: 'Mean', line: { color: 'grey', width: 2 } }; const traceUCL = { x: [0, data.length], y: [ucl, ucl], mode: 'lines', name: 'UCL', line: { color: 'red', width: 2, dash: 'dash' } }; const traceLCL = { x: [0, data.length], y: [lcl, lcl], mode: 'lines', name: 'LCL', line: { color: 'red', width: 2, dash: 'dash' } }; const layout = { title: `\${header} - C Chart`, xaxis: { title: 'Sample Number' }, yaxis: { title: header } }; Plotly.newPlot('c-chart', [traceWithin, traceOutside, traceCenterLine, traceUCL, traceLCL], layout); } ``` ``` const defaultData = "Number of Defects\n2\n1\n3\n0\n4\n3\n1\n2\n3\n1\n0\n2\n1\n3\n2\n1"; document.getElementById("data-input").value = defaultData; drawCChart(); ```

## Conclusion:

In this blog post, we have demonstrated how to create a simple C control chart web app using HTML, CSS, and JavaScript. By analyzing the count of defects in a process using C control charts, organizations can improve their understanding of process variation and work towards achieving better quality control and increased efficiency.

## Quantile (Quartile, Decile and Percentile): Manual Calculation + Microsoft Excel

49 Courses on SALE!