채우기 효과

SpreadJS는 다양한 UI 효과를 생성하여 도형의 외관을 향상시키기 위해 도형에 채우기 효과를 추가할 수 있도록 지원합니다.

단색 채우기

ShapeFillType 열거형을 사용하여 도형에 단색 채우기를 적용할 수 있습니다. 이 열거형은 solid 및 none 값을 제공하며, 아래와 같은 채우기 효과를 생성합니다:

다음 코드 예제는 도형에 단색 채우기와 채우기 없음 효과를 적용하는 방법을 보여줍니다:

// 단색 채우기를 가진 도형 추가
var shape1 = activeSheet.shapes.add("myShape1", GC.Spread.Sheets.Shapes.AutoShapeType.diamond, 200, 50, 150, 150);
var style = shape1.style();
style.fill = { type: GC.Spread.Sheets.Shapes.ShapeFillType.solid, color: 'red'};
shape1.style(style);

// 채우기 없음 도형 추가
var shape2 = activeSheet.shapes.add("myShape1", GC.Spread.Sheets.Shapes.AutoShapeType.diamond, 400, 50, 150, 150);
var style = shape2.style();
style.fill = { type: GC.Spread.Sheets.Shapes.ShapeFillType.none };
shape2.style(style);

그라데이션 채우기

색상 블렌딩 효과를 생성하여 3D 색상 효과를 제공하는 그라데이션 채우기를 도형에 적용할 수 있습니다. 각 색상의 시작 위치는 stops 속성에서 지정할 수 있으며, 색상의 밝기 및 투명도 비율도 설정할 수 있습니다.

SpreadJS는 다음 두 가지 유형의 그라데이션 채우기를 지원합니다:

선형 그라데이션 : 방향 또는 각도에 따라 정의된 도형 채우기. direction과 angle이 모두 지정된 경우, direction이 우선 적용됩니다.
방사형 그라데이션 : 중심점의 방향에 따라 정의된 도형 채우기.

도형에 적용할 그라데이션 채우기의 유형은 GradientFillType 열거형의 linear 또는 radial 값을 사용하여 설정할 수 있습니다. 그라데이션의 방향은 LinearGradientFillDirection 또는 RadialGradientFillDirection 열거형을 사용하여 설정할 수 있습니다.

다음 예제 코드는 위의 이미지에 표시된 것처럼 네 개의 도형에 선형 및 방사형 그라데이션 채우기를 적용하는 방법을 보여줍니다:

// 방향을 지정하여 선형 채우기 추가
addStyles(sheet.shapes.get('shape1'),
{   type: GC.Spread.Sheets.Shapes.GradientFillType.linear,
    direction: GC.Spread.Sheets.Shapes.LinearGradientFillDirection.linearRight,
    stops: [{color: 'pink', position: 0}, {color: 'blue', position: 1}]
});

// 각도를 지정하여 선형 채우기 추가
addStyles(sheet.shapes.get('shape2'),
{   type: GC.Spread.Sheets.Shapes.GradientFillType.linear,
    angle: 60,
    stops: [{color: 'yellow', position: 0, transparency: 0.3},
    {color: 'green', position: 0.5, transparency: 0.5},
    {color: 'blue', position: 1, transparency: 0.8, brightness: 0.2}]
});

// 오른쪽 하단 방향을 지정하여 방사형 채우기 추가
addStyles(sheet.shapes.get('shape3'),
{   type: GC.Spread.Sheets.Shapes.GradientFillType.radial,
    direction: GC.Spread.Sheets.Shapes.RadialGradientFillDirection.fromCenter,
    stops: [{color: 'blue', position: 0}, {color: 'pink', position: 1}]
});

// Add radial fill specified by bottom right direction
addStyles(sheet.shapes.get('shape4'),
{   type: GC.Spread.Sheets.Shapes.GradientFillType.radial,
    direction: GC.Spread.Sheets.Shapes.RadialGradientFillDirection.fromBottomRight,
    stops: [{color: 'yellow', position: 0}, {color: 'green', position: 1}]
});

function addStyles(shapeName, fillType) {
    var style = shapeName.style();
    style.fill = fillType;
    shapeName.style(style);
}

그림 채우기

도형에 base64 문자열 형식의 이미지 소스를 설정하여 그림을 삽입할 수 있습니다. IShapePictureFillOption 인터페이스의 fill 옵션을 사용하여 투명도 및 오프셋 속성(left, right, top, bottom)을 설정할 수 있습니다.

다음 예제 코드는 도형에 이미지를 추가하고 그 투명도를 설정하는 방법을 보여줍니다.

var shapechart = "data:image/png;base64,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";

var GCshape = sheet.shapes.add("myShape1", GC.Spread.Sheets.Shapes.AutoShapeType.rectangle, 20, 50, 400, 300);

// 그림 채우기 스타일
var stylePic = GCshape.style();
stylePic.fill = { src: shapechart, transparency: 0.2};
GCshape.style(stylePic);

텍스처 채우기

도형에 그림을 텍스처로 추가하여 텍스처 채우기를 적용할 수 있습니다. IShapeTextureFillOption 인터페이스의 tilePictureAsTexture 속성을 true로 설정하면, 그림이 텍스처처럼 반복되어 도형을 채우게 됩니다. 또한, transparency(투명도), offset(오프셋), scale(크기 비율), alignment(정렬), mirror type(반사 유형) 등의 속성도 IShapeTextureFillOption 인터페이스의 fill 옵션을 통해 설정할 수 있습니다.

다음 예제 코드는 도형에 그림을 텍스처로 추가하는 방법을 보여줍니다.

  var mesciusImg = "data:image/png;base64,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";

  var shape2 = sheet.shapes.add("myShape2", GC.Spread.Sheets.Shapes.AutoShapeType.rectangle, 10, 10, 450, 300);

  // 텍스쳐 채우기 스타일
  var styleTexture = shape2.style();
  styleTexture.fill = { src: mesciusImg, tilePictureAsTexture: true, 
                       transparency: 0.5, 
                       scaleX: 0.8, 
                       scaleY: 0.8, 
                       alignment: GC.Spread.Sheets.Shapes.TextureFillAlignment.left
                      };
  shape2.style(styleTexture);

그림 및 텍스처 채우기의 제한 사항

SpreadJS는 base64 형식의 그림만 추가할 수 있습니다.
SVG 이미지는 반드시 너비(width) 및 높이(height) 속성이 지정되어 있어야 합니다. 예를 들면 다음과 같습니다:
<svg width="5cm" height="5cm" />
PDF로 내보낼 때는 투명도(transparency) 속성이 지원되지 않습니다.
Excel로 내보낼 경우, 그림의 DPI는 96이어야 하며, 그렇지 않으면 텍스처 채우기 효과가 일관되지 않을 수 있습니다.

Ask ChatGPT

채우기 효과

단색 채우기

그라데이션 채우기

그림 채우기

텍스처 채우기

그림 및 텍스처 채우기의 제한 사항

제품

고객 서비스

메시어스 정보

정책(Policy)