문자 통계와 ImageFontWidth () 결합하여 텍스트 막대 차트를 그리기

M66 2025-05-28

웹 개발에서 도면 차트는 특히 통계를 제시 할 때 일반적인 요구 사항입니다. 전문 차트 라이브러리가 많이 있지만 때로는 직관적 인 막대 차트를 신속하게 구현하기 위해 간단한 텍스트 및 PHP 내장 기능 만 사용하면됩니다. 이 기사는 문자 통계와 PHP의 ImageFontWidth () 함수를 결합하여 GD 라이브러리를 사용하여 간단한 텍스트 막대 차트를 그리는 방법을 소개합니다.

1. 핵심 아이디어

막대 차트의 수평 축은 텍스트를 사용하여 범주를 나타냅니다. 수직 축은 텍스트 문자를 사용하여 값의 크기를 나타냅니다. 문자열의 문자 수를 계산하고 ImageFontWidth () 함수를 결합하여 각 열의 너비를 동적으로 그리기하여 각 열의 너비를 계산합니다.

2. 준비

PHP 환경이 GD 라이브러리를 지원하는지 확인하고 일반적으로 PHP_GD2 확장을 활성화하십시오.

3. 주요 기능 소개

ImageFontWidth (int $ font) : int
내장 글꼴의 문자 너비를 반환합니다. GD 라이브러리에는 다양한 크기와 너비가있는 여러 글꼴 (1 ~ 5)가 내장되어 있습니다.
imagestring (자원 $ image, int $ font, int $ x, int $ y, String $ string, int $ color) : bool
이미지에 문자열을 그립니다.

4. 샘플 코드

다음은 텍스트 막대 차트를 그리는 방법을 설명하는 간단한 예입니다.

 <?php
// 데이터 샘플，범주 => 값(문자 길이로 표현됩니다)
$data = [
    '사과' => 5,
    '바나나' => 8,
    '귤' => 3,
    '포도' => 6,
    '배' => 4,
];

// 캔버스 크기
$width = 400;
$height = 300;

// 진정한 색상 이미지를 만듭니다
$image = imagecreatetruecolor($width, $height);

// 색상 정의
$white = imagecolorallocate($image, 255, 255, 255);
$black = imagecolorallocate($image, 0, 0, 0);
$blue = imagecolorallocate($image, 0, 0, 255);

// 배경색을 채우십시오
imagefill($image, 0, 0, $white);

// 글꼴 크기를 선택하십시오（1 도착하다 5）
$font = 5;
$fontWidth = imagefontwidth($font);
$fontHeight = imagefontheight($font);

// 열 간격을 계산합니다
$barSpacing = 10;

// 시작 드로잉 좌표를 정의하십시오
$xStart = 50;
$yStart = 50;

// 최대 열 길이（문자 수는 픽셀에 매핑되었습니다）
$maxLength = max($data);
$maxBarWidth = 200;

// 데이터를 통해 히스토그램을 그립니다
foreach ($data as $label => $value) {
    // 열 너비를 계산하십시오，基于最大값缩放
    $barWidth = intval($value / $maxLength * $maxBarWidth);

    // 그리기 열（파란색 사각형을 사용하십시오）
    imagefilledrectangle($image, $xStart, $yStart, $xStart + $barWidth, $yStart + $fontHeight, $blue);

    // 绘制범주文字（게시물의 왼쪽에）
    imagestring($image, $font, $xStart - strlen($label) * $fontWidth - 10, $yStart, $label, $black);

    // 绘制값文字（게시물의 오른쪽에 있습니다）
    imagestring($image, $font, $xStart + $barWidth + 5, $yStart, str_repeat('|', $value), $black);

    // 다음 열의 수직 좌표가 아래로 이동합니다.
    $yStart += $fontHeight + $barSpacing;
}

// 출력 사진 헤더
header('Content-Type: image/png');
imagepng($image);

// 무료 메모리
imagedestroy($image);
?>

5. 코드 설명

$ 데이터 배열은 각 범주와 해당 숫자 값을 정의합니다. 값이 클수록 열이 길다.
ImageFontWidth ()를 사용하여 문자 너비를 얻으려면 텍스트와 열 길이를 정확하게 계산하십시오.
ImageFilledRectangle ()이 있는 원 주변 사각형을 그립니다.
imagestring ()을 사용하여 | 캐릭터.
열 너비를 동적으로 계산하고 열 길이는 최대 값에 비례합니다.

6. 효과 디스플레이

위의 PHP 스크립트를 실행하면 간단한 텍스트 막대 차트가 표시되는 PNG 사진이 생성됩니다. 파란색 열은 수평으로 값의 크기, 왼쪽의 범주 이름 및 오른쪽의 수직 문자로 표시되는 숫자 막대를 나타냅니다.

이 방법은 그래픽이 높지 않거나 간단한 통계 그래프를 신속하게 생성 해야하는 시나리오에 적합합니다. 더 많은 GD 기능을 결합하면 더 복잡한 그래픽 및 차트도 그릴 수 있습니다.

축, 타이틀 및 동적 글꼴 추가와 같이 더 최적화하려면이 기준으로 확장 할 수 있습니다.