大圆套小圆问题（附解决源码）

创作时间:

作者:

@小白创作中心

大圆套小圆问题（附解决源码）

引用

CSDN

https://blog.csdn.net/m0_73879806/article/details/143654538

问题描述：

最近碰到了一个数学计算问题，问题化简后如下：

有一个直径为400mm的圆形容器，问可以装下几个55mm的圆形容器？

数学推导

使用数学方法计算最优装填方案：

首先我们需要确定基本参数：

大圆半径 R = 400mm ÷ 2 = 200mm
小圆半径 r = 55mm ÷ 2 = 27.5mm

计算步骤：

a) 中心可以放置1个圆
b) 计算第一圈可以放置的圆数：

使用公式：n₁ = floor(2π ÷ (2 * arcsin(r/(R-r))))
这是基于三角函数计算得出的精确值

c) 计算后续圆环：

每个圆环的半径是前一个圆环加上一个小圆直径
对于每个圆环，计算其周长并除以小圆直径来确定可以放置的圆数
最大圆环数 = floor((R-r)/(2r))

代码实现

import React from 'react';
import { Card, CardHeader, CardTitle, CardContent } from '@/components/ui/card';

const CirclePacking = () => {
  const R = 200; // 大圆半径 (400mm / 2)
  const r = 27.5; // 小圆半径 (55mm / 2)
  
  // 计算内切圆的数量
  const calculateMaxCircles = () => {
    // 第一圈最大内切圆数
    const n1 = Math.floor(2 * Math.PI / (2 * Math.asin(r / (R - r))));
    
    // 计算可以放置的总圆数（包括中心一个）
    let totalCircles = 1; // 中心一个
    let maxRings = Math.floor((R - r) / (2 * r)); // 最大环数
    
    for (let ring = 1; ring <= maxRings; ring++) {
      const radius = ring * 2 * r; // 当前环的半径
      const circumference = 2 * Math.PI * radius; // 当前环的周长
      const circlesInRing = Math.floor(circumference / (2 * r)); // 当前环可以放置的圆数
      totalCircles += circlesInRing;
    }
    
    return {
      firstRing: n1,
      totalCircles: totalCircles,
      maxRings: maxRings
    };
  };

  // 绘制圆形布局
  const drawCircles = () => {
    const circles = [];
    const { maxRings } = calculateMaxCircles();
    
    // 添加中心圆
    circles.push(
      <circle
        key="center"
        cx={200}
        cy={200}
        r={r}
        fill="#4CAF50"
        stroke="#2E7D32"
        strokeWidth="1"
      />
    );
    
    // 添加环形圆
    for (let ring = 1; ring <= maxRings; ring++) {
      const radius = ring * 2 * r;
      const circumference = 2 * Math.PI * radius;
      const circlesInRing = Math.floor(circumference / (2 * r));
      
      for (let i = 0; i < circlesInRing; i++) {
        const angle = (2 * Math.PI * i) / circlesInRing;
        const x = 200 + radius * Math.cos(angle);
        const y = 200 + radius * Math.sin(angle);
        
        circles.push(
          <circle
            key={`${ring}-${i}`}
            cx={x}
            cy={y}
            r={r}
            fill="#4CAF50"
            stroke="#2E7D32"
            strokeWidth="1"
          />
        );
      }
    }
    
    return circles;
  };

  const result = calculateMaxCircles();

  return (
    <Card className="w-full max-w-2xl">
      <CardHeader>
        <CardTitle>圆形容器装填分析</CardTitle>
      </CardHeader>
      <CardContent>
        <div className="space-y-4">
          <div className="bg-white p-4 rounded-lg">
            <svg viewBox="0 0 400 400" className="w-full h-full">
              {/* 外部容器圆 */}
              <circle
                cx={200}
                cy={200}
                r={R}
                fill="none"
                stroke="#1976D2"
                strokeWidth="2"
              />
              {/* 内部小圆 */}
              {drawCircles()}
            </svg>
          </div>
          
          <div className="space-y-2">
            <p className="font-medium">计算结果：</p>
            <ul className="list-disc list-inside space-y-1">
              <li>大圆直径: 400mm</li>
              <li>小圆直径: 55mm</li>
              <li>第一圈可以放置: {result.firstRing} 个圆</li>
              <li>最大同心圆环数: {result.maxRings} 环</li>
              <li>总计可以放置: {result.totalCircles} 个圆</li>
            </ul>
          </div>
        </div>
      </CardContent>
    </Card>
  );
};

export default CirclePacking;