[{"id":"d1ffb4db-74d8-4220-a972-c13d6fa8123b","tags":[{"product":null,"links":null,"id":"7fcf2480-6c1f-4a24-a5be-35a201d1532b","name":"upd","color":"#7e678a","productId":"486064ee-5a7c-4d44-b127-1e19810242b2"}]},{"id":"1ea0de02-4d95-4f9a-bd1e-e4f1e58e5146","tags":[{"product":null,"links":null,"id":"7fcf2480-6c1f-4a24-a5be-35a201d1532b","name":"upd","color":"#7e678a","productId":"486064ee-5a7c-4d44-b127-1e19810242b2"}]},{"id":"cd911f7e-e532-41c5-b415-fd5a1a83b8d6","tags":[{"product":null,"links":null,"id":"7fcf2480-6c1f-4a24-a5be-35a201d1532b","name":"upd","color":"#7e678a","productId":"486064ee-5a7c-4d44-b127-1e19810242b2"}]},{"id":"54a4a5be-ed96-43df-a901-6a53495a4ff7","tags":[{"product":null,"links":null,"id":"7fcf2480-6c1f-4a24-a5be-35a201d1532b","name":"upd","color":"#7e678a","productId":"486064ee-5a7c-4d44-b127-1e19810242b2"}]},{"id":"fe055276-b12c-40ab-9569-c2d9ebd4f5b8","tags":[{"product":null,"links":null,"id":"7fcf2480-6c1f-4a24-a5be-35a201d1532b","name":"upd","color":"#7e678a","productId":"486064ee-5a7c-4d44-b127-1e19810242b2"}]},{"id":"71be3f0b-8a29-45e8-8d43-4965d3e0897e","tags":[{"product":null,"links":null,"id":"7fcf2480-6c1f-4a24-a5be-35a201d1532b","name":"upd","color":"#7e678a","productId":"486064ee-5a7c-4d44-b127-1e19810242b2"}]},{"id":"ea12b649-a786-495c-ad0f-7ef38ce94a9e","tags":[{"product":null,"links":null,"id":"27b05819-810b-4ea2-b5ea-2857947ce8be","name":"New","color":"#ed7422","productId":"486064ee-5a7c-4d44-b127-1e19810242b2"}]},{"id":"9582e49d-f693-4f0d-96b3-7f4accc2bb6e","tags":[{"product":null,"links":null,"id":"27b05819-810b-4ea2-b5ea-2857947ce8be","name":"New","color":"#ed7422","productId":"486064ee-5a7c-4d44-b127-1e19810242b2"}]},{"id":"a6f863bb-031a-44cc-8a12-fc91219e8c15","tags":[{"product":null,"links":null,"id":"27b05819-810b-4ea2-b5ea-2857947ce8be","name":"New","color":"#ed7422","productId":"486064ee-5a7c-4d44-b127-1e19810242b2"}]},{"id":"c5da505a-f378-4333-b85f-2429d057b519","tags":[{"product":null,"links":null,"id":"27b05819-810b-4ea2-b5ea-2857947ce8be","name":"New","color":"#ed7422","productId":"486064ee-5a7c-4d44-b127-1e19810242b2"}]},{"id":"7daee9d7-e908-4166-9d62-2ca3e93547fb","tags":[{"product":null,"links":null,"id":"7fcf2480-6c1f-4a24-a5be-35a201d1532b","name":"upd","color":"#7e678a","productId":"486064ee-5a7c-4d44-b127-1e19810242b2"}]},{"id":"8659262c-9b4e-4e31-9c6c-b97d1d0e0740","tags":[{"product":null,"links":null,"id":"27b05819-810b-4ea2-b5ea-2857947ce8be","name":"New","color":"#ed7422","productId":"486064ee-5a7c-4d44-b127-1e19810242b2"}]},{"id":"966a73cf-5b72-4f4b-8939-e7a06e0863da","tags":[{"product":null,"links":null,"id":"7fcf2480-6c1f-4a24-a5be-35a201d1532b","name":"upd","color":"#7e678a","productId":"486064ee-5a7c-4d44-b127-1e19810242b2"}]},{"id":"6c63e26a-a944-4aa9-a190-ecc8ac767287","tags":[{"product":null,"links":null,"id":"7fcf2480-6c1f-4a24-a5be-35a201d1532b","name":"upd","color":"#7e678a","productId":"486064ee-5a7c-4d44-b127-1e19810242b2"}]},{"id":"3af6c981-53ee-41ba-8ef7-03efb56a8fff","tags":[{"product":null,"links":null,"id":"7fcf2480-6c1f-4a24-a5be-35a201d1532b","name":"upd","color":"#7e678a","productId":"486064ee-5a7c-4d44-b127-1e19810242b2"}]},{"id":"8f1b28f2-c419-43fb-b765-5fde0a36fb08","tags":[{"product":null,"links":null,"id":"7fcf2480-6c1f-4a24-a5be-35a201d1532b","name":"upd","color":"#7e678a","productId":"486064ee-5a7c-4d44-b127-1e19810242b2"}]},{"id":"d67bf68e-cb2e-4b6f-9253-68ca0ee46560","tags":[{"product":null,"links":null,"id":"7fcf2480-6c1f-4a24-a5be-35a201d1532b","name":"upd","color":"#7e678a","productId":"486064ee-5a7c-4d44-b127-1e19810242b2"}]},{"id":"e23050c1-7dc0-4265-a2d9-eaaf938c2d35","tags":[{"product":null,"links":null,"id":"7fcf2480-6c1f-4a24-a5be-35a201d1532b","name":"upd","color":"#7e678a","productId":"486064ee-5a7c-4d44-b127-1e19810242b2"}]},{"id":"c9c6aa74-7d95-41b4-9702-98774683bf0a","tags":[{"product":null,"links":null,"id":"7fcf2480-6c1f-4a24-a5be-35a201d1532b","name":"upd","color":"#7e678a","productId":"486064ee-5a7c-4d44-b127-1e19810242b2"}]},{"id":"83a0368a-9a1a-4b31-8081-d2edc554d42f","tags":[{"product":null,"links":null,"id":"7fcf2480-6c1f-4a24-a5be-35a201d1532b","name":"upd","color":"#7e678a","productId":"486064ee-5a7c-4d44-b127-1e19810242b2"}]},{"id":"0e562678-2dd4-4972-ab4d-e718f050accb","tags":[{"product":null,"links":null,"id":"7fcf2480-6c1f-4a24-a5be-35a201d1532b","name":"upd","color":"#7e678a","productId":"486064ee-5a7c-4d44-b127-1e19810242b2"}]},{"id":"9965a8b8-f6c2-4727-a6d6-4cf12bd5b14f","tags":[{"product":null,"links":null,"id":"7fcf2480-6c1f-4a24-a5be-35a201d1532b","name":"upd","color":"#7e678a","productId":"486064ee-5a7c-4d44-b127-1e19810242b2"}]},{"id":"e805fe27-20e5-4468-85b9-078665b18438","tags":[{"product":null,"links":null,"id":"27b05819-810b-4ea2-b5ea-2857947ce8be","name":"New","color":"#ed7422","productId":"486064ee-5a7c-4d44-b127-1e19810242b2"}]},{"id":"a1a9a9bc-d0b6-4d18-8abf-5c6f2a7cfa40","tags":[{"product":null,"links":null,"id":"27b05819-810b-4ea2-b5ea-2857947ce8be","name":"New","color":"#ed7422","productId":"486064ee-5a7c-4d44-b127-1e19810242b2"}]},{"id":"fdcc0c41-acb5-4465-9b66-7e06200a48c4","tags":[{"product":null,"links":null,"id":"7fcf2480-6c1f-4a24-a5be-35a201d1532b","name":"upd","color":"#7e678a","productId":"486064ee-5a7c-4d44-b127-1e19810242b2"}]},{"id":"05d00001-6629-4aea-be2a-ddc570ca6a09","tags":[{"product":null,"links":null,"id":"27b05819-810b-4ea2-b5ea-2857947ce8be","name":"New","color":"#ed7422","productId":"486064ee-5a7c-4d44-b127-1e19810242b2"}]}]
        
(Showing Draft Content)

매개변수 사용

매개 변수를 보고서로 통합한 뒤 '매개 변수 디자이너' 페이지의 설명대로 이 매개 변수 값을 보고서 곳곳의 다양한 지점에서 참조하여 특정 요구 사항을 충족할 수 있습니다. 여기서는 가장 흔한 시나리오들을 모아서 각각을 구현하는 방법에 대한 단계별 가이드와 함께 정리했습니다.

동적 데이터 쿼리

웹 API는 보고서용 데이터 소스로 사용되는 경우가 많으며 일반적으로 매개 변수화를 지원합니다. 매개 변수 값을 제공하는 방법은 많으며, 주로 사용되는 방법을 아래에 설명하겠습니다.

경로 매개 변수

경로 매개 변수는 API 끝점의 경로 내에 포함됩니다. 예를 들어 https://demodata.mescius.io/northwind/api/v1/Categories/{id}/Products{id} 경로 매개 변수를 포함하며, 이는 제품 목록을 가져올 범주를 지정합니다.

응용 프로그램에서 사용자가 제품 범주를 선택하도록 허용해야 한다고 생각해 보세요. 다음 설명은 이를 달성하기 위한 기본 프로세스를 간략하게 보여줍니다.

  1. 아래 표시된 구성을 사용하여 보고서에 데이터 소스를 통합합니다.

    image.68e829

  2. 모든 범주의 목록을 가져오는 범주 데이터 집합을 도입합니다.

    image.de526a

  3. 아래 표시된 구성으로 범주 ID 매개 변수를 포함시킵니다.

    image.ed4efb

  4. 경로 매개 변수에 대해 3단계에서 확립된 매개 변수를 사용하는 제품 데이터 집합을 추가합니다. 유효성 검사 버튼을 클릭하면 필드 목록을 가져올 매개 변수 값을 입력하는 대화창이 표시됩니다. 여기에 1을 입력합니다.

    image.47aef2

  5. 표 등 데이터 영역을 통합하여 제품 데이터 집합을 시각화합니다.

  6. 보고서 뷰어 컴포넌트는 보고서를 로드할 때 사용자에게 범주를 선택하고 선택된 범주와 관련된 제품을 표시하도록 안내합니다.

    image.135d72

쿼리 문자열 매개 변수

쿼리 문자열 매개 변수는 데이터 요청 URL의 ? 기호 뒤에 표시됩니다. OData를 활용하는 API는 종종 이러한 쿼리 문자열 파라미터를 통해 특정 필드를 정렬, 필터링, 확장, 슬라이스, 선택하는 기능을 제공합니다. 예를 들어 다음과 같습니다.

다음 단계는 구독자가 제품 범주를 선택하도록 안내하고 선택한 범주와 관련된 제품을 표시하는 보고서를 생성하는 방법을 보여줍니다.

  1. 아래 표시된 구성을 사용하여 보고서에 데이터 소스를 통합합니다.

    datasource.4046a3

  2. 모든 범주의 목록을 가져오는 범주 데이터 집합을 도입합니다.

    image.745cd1

  3. 다음 구성으로 CategoryID 매개 변수를 포함시킵니다.

    image.7b650d

  4. 3단계의 매개 변수를 활용하는 제품 데이터 집합을 추가하여 $filter 쿼리 매개 변수의 값을 결정합니다. 유효성 검사 버튼을 클릭하면 필드 목록을 생성할 매개 변수 값을 입력하는 대화창이 표시됩니다. 여기서 1을 입력할 수 있습니다.

    image.53c28c

  5. 표 등 데이터 영역을 통합하여 제품 데이터 집합을 시각화합니다.

  6. 보고서 뷰어 컴포넌트는 보고서를 로드할 때 사용자에게 범주를 선택하고 관련된 제품을 표시하도록 안내합니다.

GraphQL 쿼리 인수

GraphQL API의 경우 쿼리 인수는 보통 POST 요청의 본문에서 전달됩니다. 아래 단계를 따라 사용자가 표시될 제품 범주를 선택하도록 허용하는 보고서를 만듭니다.

  1. 아래 표시된 구성을 사용하여 보고서에 데이터 소스를 통합합니다. Content-Type HTTP 헤더는 application/json으로 설정된다는 점에 유의하십시오. GraphQL 쿼리를 위한 요건입니다.

    image.ea639e

  2. 모든 범주의 목록을 가져오는 범주 데이터 집합을 도입합니다. 메서드는 POST이고 요청 본문에서는 쿼리에 JSON 형식을 사용합니다.

    image.d23b02

  3. 아래 구성을 사용하여 CategoryID 매개 변수를 포함시킵니다.

    image.05af58

  4. 3단계에서 추가된 매개 변수를 사용하는 제품 데이터 집합을 추가하여 id 매개 변수를 쿼리에 전달하여 특정 범주만을 반환하도록 합니다. 유효성 검사 버튼을 클릭하면 필드 목록을 생성할 매개 변수 값을 입력하는 대화창이 표시됩니다. 여기에 1을 입력합니다.

    image.553c3f

  5. 제품 데이터 집합을 보고서 본문에 끌어서 놓습니다.

  6. 보고서 뷰어 컴포넌트는 보고서를 로드할 때 사용자에게 범주를 선택하고 관련된 제품을 표시하도록 안내합니다.

HTTP 헤더

동적 HTTP 헤더를 사용하는 일반적인 시나리오는 현재 사용자의 자격 증명으로 데이터 요청을 인증하는 것입니다. 다음 단계는 Bearer 인증인증 HTTP 헤더를 사용하여 동적 HTTP 헤더를 디자인하는 기본 기법을 보여줍니다.

  1. 아래 구성으로 보고서 매개 변수를 도입합니다. 매개 변수 값을 응용 프로그램 코드로 입력할 것이므로 보고서 구독자의 대화형 작업이 필요하지 않기 때문에 숨김 플래그가 활성화됐습니다.

    image.c196c2

  2. 아래 표시된 구성으로 데이터 소스를 통합합니다. 매개 변수 값을 참조하는 인증 HTTP 헤더에 주목하십시오.

    image.2fb036

  3. 데이터 집합을 통합하여 Contoso Web API의 끝점 하나 이상에서 데이터를 읽어 들이고 데이터 영역을 추가하여 데이터 집합 데이터를 표시합니다.

  4. 응용 프로그램에서 보고서 뷰어 컴포넌트를 활용하여 보고서 출력을 표시하는 경우, 아래와 같이 파라미터 값을 설정하여 현대 사용자의 액세스 토큰을 액세스 토큰 보고서의 매개 변수 값으로 전달하는 기법을 사용할 수 있습니다.

    // This is a pseudo-code that retrieves the access token of the currently logged-in user.
    // The specific implementation depends on the architecture of your application.
    const accessToken = authService.getAccessToken(); 
    // Pass the obtained accessToken as the report's parameter value.
    viewer.open("Products.rdlx-json", {
        ReportParams: [
            {
                Name: "AccessToken",
                Value: [accessToken],
            },
        ],
    });
  5. 응용 프로그램에서 API 호출을 통해 보고서를 내보내는 경우 코드에서 아래와 같이 매개 변수의 값을 전달할 수 있습니다.

    async function exportReport(reportUrl) {
      // This is a pseudo-code that retrieves the access token of the currently logged-in user.
      // The specific implementation depends on the architecture of your application.
      const accessToken = authService.getAccessToken();
      var reportDef = await fetch(reportUrl).then((response) =>
        response.json()
      );
      const report = new GC.ActiveReports.Core.PageReport();
      await report.load(reportDef, reportParameters: [{
            Name: 'AccessToken',
            Value: [accessToken]
        }]);
      const doc = await report.run();
      const result = await GC.ActiveReports.PdfExport.exportDocument(doc, {});
      result.download("access-token.pdf");        
    }

런타임 필터링

특정 시나리오에서 매개 변수 값을 변경하면 구성이 매개 변수 값에 의존하므로 새 데이터 요청이 트리거됩니다. 이 접근법은 서버측 필터링을 통해 가져온 데이터의 볼륨을 줄이지만, 요청을 보내고 반응을 처리하는 데 추가적인 시간이 들어갑니다.

경우에 따라 모든 데이터를 한꺼번에 받아서 새 데이터를 요청할 필요 없이 매개 변수 값을 기반으로 클라이언트 측에 필터를 적용하는 편이 더 나을 수 있습니다. 이 접근법은 매개 변수 값에 바인드된 데이터 영역 필터를 사용하여 달성할 수 있습니다. 다음 단계는 이 시나리오를 구현하는 방법을 간단하게 설명합니다.

  1. 데이터 소스 통합: 아래 표시된 구성을 사용하여 보고서에 데이터 소스를 추가합니다.

    datasource.4046a3 (1)

  2. 범주 데이터 집합 도입: 이 데이터 집합은 모든 범주의 목록을 가져옵니다.

    image.745cd1 (1)

  3. CategoryID 매개 변수 포함: CategoryID 매개 변수를 아래와 같이 설정합니다.

    image.7b650d (1)

  4. 제품 데이터 집합 추가: 이 데이터 집합은 모든 제품을 가져옵니다. 가져온 필드 목록은 OData API의 $select 기능에 의해 제한됩니다.

    image.c74549

  5. 제품 데이터 집합에서 표 생성: 제품 데이터 집합을 보고서 디자인 표면에 끌어서 놓습니다. 이 작업은 자동으로 제품 이름범주 Id 열이 있는 새 표를 생성합니다..

  6. 표에 필터 추가: 새로 생성된 표를 선택하고 속성 패널의 속성 탭으로 이동합니다. 필터 속성을 찾고 추가 버튼을 클릭합니다.

    image.13cfe7

  7. 필터 구성: 필터 에디터에서 새 항목을 추가합니다. = 연산자 왼쪽에서 CategoryId를 선택하고 오른쪽에서 CategoryID 매개 변수를 선택합니다.

    image.54340d

  8. 보고서 미리 보기: 이제 보고서를 미리 보기하고 범주 간에 전환할 수 있습니다. 추가 데이터 요청 없이 선택된 범주의 제품이 표에 나타납니다.

대화형 작업을 통해 매개 변수 적용하기

ActiveReportsJS는 매개 변수 패널을 통한 매개 변수 값 설정뿐 아니라 매개 변수의 대화형 응용 프로그램도 지원합니다. 매개 변수 적용 대화형 작업은 사용자가 보고서 출력의 대화형 요소를 클릭할 때 활성화되어 보다 동적이고 반응적인 보고서 상호작용을 실현합니다.

이 접근법을 통해 대시보드 같은 기능을 제공하는 대화형 필터를 구성하여 보다 사용자 친화적이고 직관적인 데이터 탐색을 지원할 수 있습니다. 그러한 보고서 제작에 대한 상세 가이드는 페이지 없는 보고서 시작하기 설명서를 참조하십시오. 이 가이드는 보고서에서 대화형 작업을 활용하여 사용자 경험을 개선하는 방법에 대한 단계별 안내를 제공합니다.

보고서 간 데이터 전달하기

ActiveReportsJS는 다른 보고서 내에서 하위 보고서 보고 항목을 사용하여 보고서 통합을 위한 종합 솔루션을 제공합니다. 이 기능을 통해 링크된 보고서의 출력을 메인 보고서에 추가할 수 있습니다. 이 기능의 일반적인 응용 사례 중 하나는 마스터-디테일 보고서의 생성입니다. 메인 보고서는 일반 개요(마스터)를 제시하고 하위 보고서(디테일)는 각 레코드에 대해 보다 상세한 데이터를 제공합니다.

이 절차를 촉진하기 위해 링크된 보고서는 숨겨진 매개 변수를 가질 수 있습니다. 메인 보고서로부터 값을 받는 이러한 매개 변수는 특정 데이터 포인트를 하위 보고서로 전송하도록 허용합니다. 이 값 전달 메커니즘은 하위 보고서 컨트롤 속성에 의해 촉진되며, 이를 통해 매개 변수 값을 원하는 대로 설정할 수 있습니다.

비슷한 방식으로 매개 변수 값은 드릴스루 보고서로도 전달됩니다. 드릴스루 보고서는 하위 보고서의 상세 데이터를 심층적으로 제공함으로써 사용자가 필요에 따라 메인 보고서에서 관련 데이터를 보도록 지원합니다.

드릴스루 보고서 구현에 대한 보다 상세한 지침은 드릴스루 보고서 시작하기 설명서를 참조하십시오. 이 가이드에서는 이 보고 유형에 대한 단계별 안내를 제공합니다.

보고서 출력 사용자 정의하기

보고서 항목은 런타임에서 표현식으로 평가되는 속성을 노출합니다. 즉 이러한 표현식은 매개 변수 값에 대한 참조를 포함할 수 있습니다. 이 기능을 통해 사용자 기본 설정을 바탕으로 보고서 출력을 맞춤 설정할 수 있습니다.

보고서에 두 가지 가능한 값이 있는 테마 매개 변수가 있다고 가정하겠습니다. 어둡게밝게입니다. 보고서 항목의 속성 내에서 이 매개 변수를 참조하여 보고서 구독자가 테마 간에 동적으로 전환하도록 지원할 수 있습니다.

예를 들어 텍스트 상자의 텍스트 색{IIF(@Theme="Dark", "White", "Black")}으로 설정하고 배경색{IIF(@Theme="Dark", "Black", "White")}로 설정할 수 있습니다. 선택된 테마를 바탕으로 텍스트 및 배경색을 조정하여 보다 개인화된 사용자 경험을 제공합니다.

다중 값 매개 변수로 작업하기

파라미터 속성의 다중 값 특성은 매개 변수가 다중 값을 받을 수 있는지 여부를 지정하는 데 사용됩니다. 이 특성이 설정되면 매개 변수의 값이 표현식에서 배열 객체로 반환됩니다. 이 배열은 일반적으로 다른 포맷으로 변환되어야 합니다.

예를 들어 배열을 쉼표나 기타 구분자로 구분된 값의 문자열로 변환하려면 Join 함수{Join(@parameterName, ",") 포맷으로 사용할 수 있습니다.

보고서에 보다 복잡한 작업이 필요한 경우 사용자 정의 코드 기능을 활용할 수 있습니다. 이 기능은 배열을 입력으로 받고 원하는 출력을 반환하는 함수를 만들도록 지원합니다. 이는 다중 값 매개 변수를 특정 요건에 따라 처리 및 조작할 때 더 많은 유연성을 제공합니다.

계단식 매개 변수 구현하기

계단식 매개 변수는 한 매개 변수의 값이 다른 매개 변수에서 선택된 값에 의존하는 구성입니다. 이 기능은 고정된 레이아웃 보고서 시작하기 설명서에서 다뤄지며 선택된 고객의 주문 목록을 표시하는 데 사용됩니다. 계단식 매개 변수 설정은 다음 컴포넌트와 관련됩니다.

  • 첫 매개 변수 값에 따라 구성되는 DataSet입니다. 예를 들어, 고정 레이아웃 보고서 연습에서는 매개 변수화된 OData 필터 쿼리를 사용하여 데이터를 필터링하는 데이터 집합을 사용합니다.

  • 데이터 집합에서 사용 가능한 값을 가져오는 두 번째 매개 변수. 첫 번째 매개 변수의 값이 바뀌면 데이터 집합이 업데이트되고, 이에 따라 두 번째 매개 변수의 사용 가능한 값이 새로 고침됩니다. 이 동적 상호 작용은 보다 반응적이고 직관적인 사용자 경험을 지원합니다.

펼쳐서 계단식 매개 변수의 실제 사용 사례를 확인하십시오.

CascadingParameters