정식출시 Wijmo 2021 v1 출시
페이지 정보
작성자 GrapeCity
작성일 2021-04-07 14:48 조회 1,015회
댓글 0건
본문
관련링크
Wijmo가 2021년 첫 번째 주요 릴리스를 출시했습니다. 이 릴리스에는 새로운 RestCollectionView, MultiRow용 셀 템플릿 및 시각화 맵 컨트롤 기능인 FlexMap 베타 버전이 포함되어 있습니다. 이제 출시된 릴리스에 대해 자세히 알아보겠습니다.
JavaScript, Angular, React 및 Vue를 위한 시각화 맵
지리 데이터 시각화를 위한 새로운 맵 컨트롤 기능인 FlexMap을 발표하게 되어 기쁘게 생각합니다. 맵 컨트롤을 통해 데이터를 보다 생동감 있게 사용할 수 있으며 훨씬 쉽게 분석할 수 있습니다. 이 JavaScript UI 컴포넌트를 사용하면 지리 데이터 시각화를 멋지게 구현해낼 수 있습니다. 맵은 현재 베타 버전이기 때문에 피드백이 있으면 저희에게 피드백을 주세요. 피드백을 수렴하여 맵을 개선하고 편의상 일부 지도 팩(지역 맵 파일)을 추가할 계획입니다.
FlexMap은 분산형 및 거품형 맵 같은 단계구분도 및 포인트 맵 렌더링을 지원합니다. 또한 지리적 피처 레이어 및 포인트 레이어를 바인딩하기 위해 GeoJSON을 사용합니다. NaturalEarthData를 공용 도메인인 GeoJSON 데이터의 소스로 권장하고 MapShaper를 필요에 따라 사용자 정의할 수 있습니다. 물론, 다른 많은 소스들이 있고, 이미 여러분만의 소스를 가지고 있을지도 모릅니다!
JavaScript, Angular, React 및 Vue에서 단계구분도 생성
FlexMap을 사용하면 코드 몇 줄로 쉽게 단계구분도를 만들 수 있습니다. 단계구분도는 지리적 영역에 대한 통계 값을 표시하는 데 사용됩니다. 각 영역은 해당 영역이 나타내는 데이터를 기반으로 색상이 지정됩니다.
JavaScript, Angular, React 및 Vue에서 분산형 맵 생성
FlexMap은 분산형 맵을 쉽게 생성할 수 있는 점 차트를 지원합니다. 분산형 맵은 맵의 특정 좌표에 관심 지점을 표시하는 데 사용됩니다.
JavaScript, Angular, React 및 Vue에서 버블 맵 생성
마찬가지로, FlexMap은 버블 맵을 만드는 데 사용할 수 있습니다. 버블 맵은 맵에 관심 지점을 나타내지만, 값을 포인트로 간주합니다. 버블 크기는 데이터 값(큰 값=큰 버블)에 따라 달라집니다.
차트를 위한 새로운 동적 팔레트
보기 좋은 단계구분도를 만들기 위해 기존 wijmo.chart.Palettes api에 새로운 팔레트를 추가했습니다. 새로운 팔레트는 맵뿐만 아니라 차트에서도 사용할 수 있습니다!
팔레트는 ColorBrewer 2에서 영감을 받아 다음과 같은 범주로 그룹화됩니다.
- 순차적 범위(SequentialSingle 및 SequentialMulti) - 낮은 값(밝은색)에서 높은 값(진한색)까지 순차적인 데이터를 나타내는 데 적합합니다.
- 발산 범위 - 중간 범위 임계값과 극단 값을 양쪽 끝에서 동일하게 강조합니다. 중간 범위 색은 밝은색, 극도로 낮거나 높은 값은 어두운색입니다.
- 질적 범위 - 명목상 데이터나 범주형 데이터 표현에 적합합니다. 색상이 값의 차이를 나타내지 않습니다.
이 새로운 팔레트는 멋진 차트를 만들 수 있습니다. 차트 팔레트 데모에서 직접 사용해 보세요.
REST API에 바인딩하기 위한 RestCollectionView
많은 고객들이 데이터 관리에 REST API를 사용합니다. 그래서 자체 REST API에 연결하여 CollectionView를 확장하고 바인딩 가능하게 만드는 편리한 기본 클래스를 만들었습니다. RestCollectionView에 원하는 수의 컴포넌트를 바인딩하여 서버에 전체적으로 전달할 수 있습니다.
이것을 사용하려면 RestCollectionView를 확장하는 클래스를 만들고 다음 메서드에 대한 재정의를 추가하면 됩니다.
- getItems: 서버에서 항목 목록을 얻습니다. 목록을 정렬, 필터링 및 페이징할 수 있습니다.
- addItem: 서버의 컬렉션에 항목을 추가합니다.
- patchItem: 서버의 컬렉션에 있는 항목을 편집합니다.
- deleteItem: 서버의 컬렉션에서 항목을 삭제합니다.
기본적으로 정렬, 페이징 및 필터링은 서버에서 수행되지만, 클라이언트에서는 해당 설정을 변경할 수 있습니다.
그다음부터는 Wijmo에게 맡겨주세요! 사용자 정의 RestCollectionView를 Wijmo 컨트롤에 바인딩할 수 있으며, 필요한 여러 CRUD 작업에 대해 서버에 자동으로 호출합니다.
- JavaScript REST CollectionView 데모
- Angular REST CollectionView 데모
- React REST CollectionView 데모
- Vue REST CollectionView 데모
Angular, React 및 Vue를 위해 MultiRow에 추가된 셀 템플릿
셀 템플릿은 Angular, React 및 Vue를 사용할 때 FlexGrid에서 가장 인기 있는 기능 중 하나입니다. 셀 템플릿을 사용하면 셀에 사용자 정의 내용을 정의하기 위해 마크업을 사용할 수 있습니다. 현재 이 기능은 MultiRow에서 제공됩니다! MultiRow의 모든 셀에 대한 사용자 정의 셀 템플릿을 추가할 수 있습니다. 셀 템플릿은 바인딩 구문, 중첩된 컴포넌트, 사용자 정의 HTML 및 조건부 로직을 지원합니다. 어떤 방식으로든 그리드를 사용자 정의할 수 있는 간단하고 선언적인 방법을 제공합니다.
변경 로그
- [FlexGrid] Ctrl+클릭을 사용하여 여러 열 그룹을 확장/축소합니다. 이 작업은 Ctrl+클릭을 사용하여 여러 행 그룹을 확장/축소하는 것과 일치합니다.
- [FlexGrid] 행 높이를 업데이트할 때 autoSizeMode 속성 값을 고려하도록 autoRowHeights 속성이 개선되었습니다.
- [FlexGrid] 향상된 셀 다시 정렬 알고리즘으로 스크롤 성능이 개선되었습니다.
- [PivotField] 다른 집계를 기반으로 사용자 정의 집계를 사용하여 필드 생성을 지원하는 getAggregateValue 속성이 추가되었습니다.
- [Calendar, InputDate] 편의를 위해 rangeChanged 이벤트를 추가했습니다.
- [Globalize] FormatNumber는 더 이상 0처럼 보이는 음수에 대해 음수 기호를 표시하지 않습니다(예: formatNumber(-0.4, 'n0')은 '-0' 대신 '0'을 반환합니다).
- [RESTCollectionView] 사용자 정의 REST 기반 CollectionView 클래스를 구현하는 데 도움이 되도록 설계된 RESTCollectionView 추상 클래스가 포함된 wijmo.rest 모듈을 추가했습니다.
- [FlexMap] 지형 공간 데이터를 시각화하도록 특별히 설계된 새로운 차트 작성 컨트롤 기능인 FlexMap을 도입했습니다. 새 컨트롤은 새 wijmo.chart.map 모듈에 포함되어 있습니다.
- [FlexChart] ColorBrewer(https://colorbrewer2.org)에서 색 구성표를 추가했습니다.
- [MultiRow] layoutDefinition 속성의 내용은 이제 MultiRowCellGroup 개체의 컬렉션을 사용하여 정의할 수 있습니다. 여기에는 MultiRowCell 개체의 컬렉션이 포함됩니다. POJO 배열을 사용하여 layoutDefinition을 정의하는 이전 방식도 지원됩니다.
- [MultiRow/Interops] FlexGrid의 셀 템플릿과 유사한 Angular, React 및 Vue 프레임워크의 셀 템플릿 지원이 추가되었습니다. 기능을 시연하기 위해 새 Grid/MultiRow/CellTemplates 샘플이 추가됩니다.
