Angular 차트 작업

    Infragistics Angular Excel 엔진의WorksheetChart 기능은 워크시트 내 셀 영역 간 데이터 추세를 시각적 차트로 표현할 수 있게 해줍니다. 예를 들어, 엑셀 데이터를 열, 선 또는 70가지 이상의 차트 유형으로 시각화한 셀 영역에서 보고 싶을 때, 이 기능이 이를 도와줄 수 있습니다.

    Angular Working with Charts Example

    [!Note] The XLSX format is required. Other formats are not supported at this time.

    Usage

    워크시트에 차트를 추가하려면 워크시트의 도형 컬렉션 방식을 사용해야AddChart 합니다. 이 방법에서는 사용할 차트 유형, 왼쪽 위 셀, 오른쪽 아래 셀, 그리고 차트가 차지할 셀의 비율을 지정할 수 있습니다.

    이 메서드는AddChart 워크시트에 추가할 차트 요소를 반환합니다. 이 기능을 갖추면, 차트의 메서드를setSourceData 사용해 데이터 소스로 사용할 워크시트 셀 영역의 셀 주소를 설정하고, 열과 행의 매핑을 X축과 Y축으로 전환할지 여부도 결정할 수 있습니다.

    70가지 이상의 지원 차트 유형이 있으며, 여기에는Line​Area​IgxColumnComponent, 그리고Pie 포함됩니다.

    다음 코드는 Excel 차트 기능을 사용하는 방법을 보여줍니다. 아래 코드 조각은 워크시트 첫 번째 행의 첫 번째 셀과 13번째 셀 사이에 세로 막대형 차트를 추가합니다. 그런 다음 A2:M6 영역의 데이터에 대한 소스 데이터가 설정되어 기둥형 차트의 X 및 Y축에 대한 열과 행의 매핑이 전환됩니다.

    var chart = ws.shapes().addChart(ChartType.ColumnClustered,
      ws.rows(0).cells(0), { x: 0, y: 0 },
      ws.rows(0).cells(12), { x: 100, y: 100 });

chart.setSourceData("A2:M6", true);

    API References