데이터 시각화 및 보고를 위한 JavaScript 라이브러리. 무료 개발 도구. 당신의 생각?

3311 단어 codingwebdevdevtipsjavascript
커뮤니티 여러분 안녕하세요!

우리 팀이 작업하고 있는 비상업적 프로젝트를 당신과 공유하고 싶습니다.

우리는 시각화와 분석이 비즈니스를 완전히 뒤흔든다고 진심으로 믿습니다. 또한 우리 팀은 미래가 웹 솔루션을 지향한다고 믿습니다. 그래서 우리는 제품 이름을 WebDataRocks로 지정했습니다. :)

이 도구는 개발자와 개발자를 위해 만들어졌습니다. 따라서 우리는 기술 커뮤니티의 의견에 정말 감사할 것입니다.

WebDataRocks 피벗 테이블에 대한 간략한 설명



집계 방식으로 데이터를 시각화하는 무료 포함 JavaScript 라이브러리입니다.

더 구체적으로 말하면 브라우저에서 동적 보고서를 생성할 수 있는 Excel과 유사한 피벗 테이블입니다. 최대 1MB의 CSV 및 JSON 데이터와 함께 작동합니다.

개발자를 위한 주요 가치



기성품이며 잘 설계된 무료 도구입니다. 프레임워크 및 기타 라이브러리와 간단히 통합됩니다. 사용자 정의 및 현지화가 가능합니다.

따라서 모든 개발자는 데이터 분석이 필요한 모든 웹 프로젝트에 추가할 수 있습니다.

관심 있는? - 이 도구의 기능에 대한 아이디어를 얻을 수 있도록 핵심 기능에 대해 좀 더 설명하겠습니다.

분석



집계되지 않은 데이터가 있습니다. 웹 보고 도구를 사용하여 수행할 수 있는 작업은 다음과 같습니다.
  • 필요한 구성원을 행과 열로 드래그하여 필드 목록으로 데이터 구성
  • 보고서에 표시하려는 필수 구성원을 선택하여 데이터 필터링
  • 다단계 계층 구조를 통한 그룹 데이터

    • WebDataRocks는 합계, 개수, 평균, 최소, 최대, 차이 등과 같은 13가지 유형의 집계를 지원합니다. 보고서에 충분하지 않은 경우 자체 기능을 설정할 수 있는 계산된 값이 있습니다.

    심상



    보고서가 이미 구성된 경우 추가로 다음을 수행할 수 있습니다.
  • 값 확장, 축소 및 정렬
  • 셀을 드릴스루하여 집계되지 않은 값 보기
  • 필요한 숫자 서식을 설정하기 위해 셀 서식 지정
  • 조건부 서식을 설정하여 셀에 색상을 지정하고 필요한 값을 강조 표시합니다
    • .

    피벗 그리드는 이렇게 생겼습니다.



    보너스로
    미리 정의된 테마, 현지화 파일, 미리 만들어진 통합 래퍼 - 개발자의 작업을 용이하게 할 수 있는 모든 것.

    추가: 보고서를 저장하고 내보내고(PDF, Excel, HTML) 인쇄할 수 있습니다.

    테스트하고 보고서를 작성해 보겠습니다.

    먼저 WebDataRocks를 다운로드합니다(how to do it에 대한 몇 가지 옵션이 있으며 가장 적합한 것을 선택합니다. 이 예에서는 CDN을 참조하겠습니다)

    둘째, HTML 파일의 태그 사이에 WebDatarocks를 추가합니다.

    
<html>
<head></head>
<body>
<div id="wdr-component"></div>
<link href="https://cdn.webdatarocks.com/latest/webdatarocks.min.css" rel="stylesheet"/>
<script src="https://cdn.webdatarocks.com/latest/webdatarocks.toolbar.min.js"></script>
<script src="https://cdn.webdatarocks.com/latest/webdatarocks.js"></script>
<script>
var pivot = new WebDataRocks({
    container: "#wdr-component",
    toolbar: true,
    report: {
        dataSource: {
            filename: "https://cdn.webdatarocks.com/data/data.csv"
        }
    }
});
</script>
</body>
</html>

    마지막 단계 - 데이터 로드:

    CSV 또는 JSON 파일의 URL을 보고서에 직접 추가합니다. 파일 이름에 파일의 URL을 지정하기만 하면 됩니다.

    filename: "URL-to-your-CSV-or-JSON-file"

    그게 다야. 보고서가 준비되었습니다!



    자세한 정보는 documentation 에 나와 있습니다.

    전체 코드를 보려면:


    아직 거기 계세요? :-) - 읽어 주셔서 감사합니다!

    그래서 당신은 어떻게 생각하십니까? 사용할 수 있는 아이디어나 사례가 있습니까?
    공유해주세요.
    사이트 로봇.txt
    3.postback이란 무엇인가

    좋은 웹페이지 즐겨찾기

    개발자 우수 사이트 수집

    개발자가 알아야 할 필수 사이트 100선 추천 우리는 당신을 위해 100개의 자주 사용하는 개발자 학습 사이트를 정리했습니다
    best100-homepage