๊ฐ€์ด๋“œ
์„ค์น˜

์„ค์น˜

RealPivot2 ํŒจํ‚ค์ง€ ์„ค์น˜ ๋ฐฉ๋ฒ•๊ณผ ๋ผ์ด์„ ์Šค ๋ฐ ์Šคํƒ€์ผ ์ ์šฉ ๋ฐฉ๋ฒ•์„ ์•ˆ๋‚ดํ•œ๋‹ค.

RealPivot2 ๋ชจ๋“ˆ์€ npm ํŒจํ‚ค์ง€๋กœ ์„ค์น˜ํ•˜์—ฌ importํ•ด ์‚ฌ์šฉํ•˜๊ฑฐ๋‚˜,

npm i realpivot2
import { createControl, setLicenseKey } from 'realpivot2';
import 'realpivot2/style.css';

HTML์— <script> ํƒœ๊ทธ๋กœ ์ง์ ‘ ๋ถˆ๋Ÿฌ์˜ฌ ์ˆ˜๋„ ์žˆ๋‹ค.

<script type="text/javascript" src="../lib/realpivot2.min.js"></script>
<link href="../styles/realpivot2-style.css" rel="stylesheet" />

๋‹จ, ์–ด๋–ค ๋ฐฉ์‹์„ ์„ ํƒํ•˜๋“  RealPivot2์˜ ๊ธฐ๋ณธ ์Šคํƒ€์ผ์ด ๋‹ด๊ธด CSS ํŒŒ์ผ๋„ ํ•จ๊ป˜ ๋กœ๋“œํ•ด์•ผ ํ•œ๋‹ค.

RealPivot2๋Š” ์ƒ์šฉ ๋ผ์ด์„ ์Šค๋กœ ๋ฐฐํฌ๋˜๊ธฐ ๋•Œ๋ฌธ์— ์šฐ๋ฆฌํ…Œํฌ์—์„œ ์ œ๊ณตํ•œ ๋ผ์ด์„ ์Šค๋ฅผ ๋ณ„๋„๋กœ ์ ์šฉํ•ด์•ผ ํ•œ๋‹ค.

HTML์— ๋ผ์ด์„ ์Šค ์Šคํฌ๋ฆฝํŠธ๋ฅผ ํฌํ•จํ•˜๋Š” ๊ฒฝ์šฐ:

<script type="text/javascript" src="../lib/realpivot2-lic.js"></script>

๋ผ์ด์„ ์Šค ํŒŒ์ผ์—๋Š” ๋ณดํ†ต ์•„๋ž˜์™€ ๊ฐ™์ด ์ „์—ญ ๋ณ€์ˆ˜๊ฐ€ ์„ค์ •๋œ๋‹ค.

var realPivot2Lic = '......๋ผ์ด์„ ์Šค์ •๋ณด.....';

๋ชจ๋“ˆ ๋ฒˆ๋“ค๋Ÿฌ ํ™˜๊ฒฝ์—์„œ๋Š” setLicenseKey๋กœ ๋“ฑ๋กํ•  ์ˆ˜ ์žˆ๋‹ค.

import { setLicenseKey } from 'realpivot2';
 
setLicenseKey('......๋ผ์ด์„ ์Šค์ •๋ณด.....');

ํƒ์ƒ‰๊ธฐ์˜ ChartยทMap ํŒจ๋„์„ ์‚ฌ์šฉํ•˜๋ ค๋ฉด RealChartยทRealMap ๋ชจ๋“ˆ๊ณผ ํ•ด๋‹น ์Šคํƒ€์ผ์„ ํ•จ๊ป˜ ๋กœ๋“œํ•˜๊ณ , use / useAll(ReactยทVue๋Š” modules prop)๋กœ ๋“ฑ๋กํ•œ๋‹ค. ํƒ์ƒ‰๊ธฐ ์•ˆ์—์„œ ์“ฐ๋Š” ChartยทMap์€ RealPivot2๊ฐ€ ์ž์‹ ์˜ ๋ผ์ด์„ ์Šค ํ‚ค๋ฅผ ์ „๋‹ฌํ•˜๋ฏ€๋กœ realchart-lic.js / realmap-lic.js๋Š” ํ•„์š” ์—†๋‹ค.

import * as RealChart from 'realchart';
import * as RealMap from 'realmap';
import { useAll } from 'realpivot2';
import 'realchart/realchart-style.css';
import 'realmap/realmap-style.css';
 
useAll({ RealChart, RealMap });
<script type="text/javascript" src="../lib/realchart.js"></script>
<script type="text/javascript" src="../lib/realmap.js"></script>
<link href="../styles/realchart-style.css" rel="stylesheet" />
<link href="../styles/realmap-style.css" rel="stylesheet" />

RealChartยทRealMap์„ ํ”ผ๋ฒ— ํƒ์ƒ‰๊ธฐ ๋ฐ–(๊ฐ ์ œํ’ˆ ๋‹จ๋…)์—์„œ ์“ฐ๋ ค๋ฉด ํ•ด๋‹น ์ œํ’ˆ ๋ผ์ด์„ ์Šค๋ฅผ ๋”ฐ๋กœ ์ ์šฉํ•ด์•ผ ํ•œ๋‹ค.

Excel / CSV / PDF ๋‚ด๋ณด๋‚ด๊ธฐ ์‚ฌ์šฉ๋ฒ•์€ ๋‚ด๋ณด๋‚ด๊ธฐ ํŽ˜์ด์ง€๋ฅผ ์ฐธ๊ณ ํ•œ๋‹ค. ReactยทVue ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์— ์ ์šฉ(์—ฐ๋™)ํ•˜๋Š” ๋ฐฉ๋ฒ•์€ React ๊ฐœ๋ฐœ ๊ฐ€์ด๋“œยทVue ๊ฐœ๋ฐœ ๊ฐ€์ด๋“œ๋ฅผ ์ฐธ๊ณ ํ•œ๋‹ค.