ΠΡΠΈΠ²Π΅Ρ,
ΠΊΠ°ΠΊΠΎΠ²Ρ ΠΌΠΈΠ½ΠΈΠΌΠ°Π»ΡΠ½ΡΠ΅ ΡΡΠ΅Π±ΠΎΠ²Π°Π½ΠΈΡ d3js Π΄Π»Ρ c3?
Π― Ρ
ΠΎΡΠ΅Π» Π±Ρ ΡΠΎΠ·Π΄Π°ΡΡ ΠΌΠΈΠ½ΠΈΠΌΠ°Π»ΡΠ½ΡΡ ΡΠ±ΠΎΡΠΊΡ Π΄Π»Ρ d3.js Ρ ΡΠ°ΠΊΠΈΠΌΠΈ Π²Π΅ΡΠ°ΠΌΠΈ, ΠΊΠ°ΠΊ:
import {scaleLinear} from "d3-scale";
ΠΠ· Π΄ΠΎΠΊΡΠΌΠ΅Π½ΡΠ° D3: Β«D3 Π½Π°ΠΏΠΈΡΠ°Π½ Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ΠΌ ΠΌΠΎΠ΄ΡΠ»Π΅ΠΉ ES2015β¦Β» https://github.com/d3/d3
ΡΠ°ΠΊ ΡΡΠΎ, Π΅ΡΠ»ΠΈ Ρ ΠΊΠΎΠ³ΠΎ-ΡΠΎ Π΅ΡΡΡ ΡΠΏΠΈΡΠΎΠΊ, ΠΌΠΎΠΆΠ΅Ρ Π±ΡΡΡ Π·Π΄ΠΎΡΠΎΠ²ΠΎ.
Π Π½Π°ΡΡΠΎΡΡΠ΅Π΅ Π²ΡΠ΅ΠΌΡ Ρ ΡΠΎΠ·Π΄Π°Ρ ΠΏΡΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅ Vuejs Ρ Π²Π΅Π±-ΠΏΠ°ΠΊΠ΅ΡΠΎΠΌ ΠΈ ΠΎΠ±ΠΎΠ»ΠΎΡΠΊΠΎΠΉ vue Π²ΠΎΠΊΡΡΠ³ C3: https://github.com/chryb/vue-c3 .
Π Π°Π·ΠΌΠ΅Ρ ΠΌΠΎΠ΅Π³ΠΎ ΠΏΠ°ΠΊΠ΅ΡΠ° Π²Π΅Π»ΠΈΠΊ ΡΠΎΠ»ΡΠΊΠΎ Π΄Π»Ρ ΠΎΠ΄Π½ΠΎΠ³ΠΎ ΠΌΠ°Π»Π΅Π½ΡΠΊΠΎΠ³ΠΎ Π³ΡΠ°ΡΠΈΠΊΠ°, ΠΏΠΎΡΡΠΎΠΌΡ ΠΌΠΎΠΉ Π²ΠΎΠΏΡΠΎΡ.
ΡΡΠΎ ΡΠ°Π±ΠΎΡΠ°Π΅Ρ Π΄Π»Ρ ΠΌΠ΅Π½Ρ, ΡΡΠΎ ΡΠΌΠ΅Π½ΡΡΠΈΡ ΡΠ°Π·ΠΌΠ΅Ρ d3 ΠΏΡΠΈΠΌΠ΅ΡΠ½ΠΎ Π½Π° 50%
d3-ΠΌΠ°ΡΡΠΈΠ².js
d3-brush.js
d3-ΠΊΠΎΠ»Π»Π΅ΠΊΡΠΈΡ.js
d3-color.js
d3-dispatch.js
d3-Π»Π΅Π³ΠΊΠΎΡΡΡ.js
d3-format.js
d3-interpolate.js
d3-path.js
d3-ΡΠΊΠ°Π»Π°-chromatic.js
d3-ΠΌΠ°ΡΡΡΠ°Π±.js
d3-Π²ΡΠ±ΠΎΡ.js
d3-shape.js
d3-time-format.js
d3-timer.js
d3-transition.js
d3-zoom.js
Π― _ΠΎΡΠ΅Π½Ρ_ Π·Π°ΠΈΠ½ΡΠ΅ΡΠ΅ΡΠΎΠ²Π°Π½ Π² ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»ΡΡΠΊΠΎΠΉ ΡΠ±ΠΎΡΠΊΠ΅ C3, ΠΈΠΌΠΏΠΎΡΡΠΈΡΡΡΡΠ΅ΠΉ ΡΠΎΠ»ΡΠΊΠΎ Π½Π΅ΠΎΠ±Ρ
ΠΎΠ΄ΠΈΠΌΡΠ΅ ΠΌΠΎΠ΄ΡΠ»ΠΈ D3 Π΄Π»Ρ Π½Π°ΡΠ΅Π³ΠΎ Π²Π°ΡΠΈΠ°Π½ΡΠ° ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΡ.
(ΠΠ°ΠΏΡΠΈΠΌΠ΅Ρ, ΡΠΎΠ»ΡΠΊΠΎ Π±Π°Π·ΠΎΠ²ΡΠ΅ Π»ΠΈΠ½Π΅ΠΉΠ½ΡΠ΅ Π³ΡΠ°ΡΠΈΠΊΠΈ Π²ΡΠ΅ΠΌΠ΅Π½Π½ΡΡ
ΡΡΠ΄ΠΎΠ² Ρ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΠΌΠΈ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠ°ΠΌΠΈ, ΠΌΠ°ΡΡΡΠ°Π±ΠΈΡΠΎΠ²Π°Π½ΠΈΠ΅ΠΌ ΠΈ Π²ΡΠ±ΠΎΡΠΎΠΌ)
ΠΠ΄Π½Π°ΠΊΠΎ: ΠΌΠ½Π΅ Π½Π΅ ΡΠ΄Π°Π»ΠΎΡΡ Π·Π°ΡΡΠ°Π²ΠΈΡΡ Π΅Π³ΠΎ ΡΠ°Π±ΠΎΡΠ°ΡΡ Π΄ΠΎΠ»ΠΆΠ½ΡΠΌ ΠΎΠ±ΡΠ°Π·ΠΎΠΌ Π² ΠΏΡΠΎΠ΅ΠΊΡΠ΅ ΠΈΠΌΠΏΠΎΡΡΠ° Rollup/ES6.
ΠΡΠ΄Π΅ΠΌ ΠΏΡΠΈΠ·Π½Π°ΡΠ΅Π»ΡΠ½Ρ Π·Π° Π»ΡΠ±ΡΠ΅ ΡΠ°Π±ΠΎΡΠΈΠ΅ ΠΏΡΠΈΠΌΠ΅ΡΡ/ΡΠΎΠ²Π΅ΡΡ ΠΎ ΡΠΎΠΌ, ΠΊΠ°ΠΊ ΡΠΎΠ·Π΄Π°ΡΡ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»ΡΡΠΊΡΡ Π²Π΅ΡΡΠΈΡ C3 (ΡΠΎ Π·Π½Π°ΡΠΈΡΠ΅Π»ΡΠ½ΡΠΌ ΡΠΌΠ΅Π½ΡΡΠ΅Π½ΠΈΠ΅ΠΌ ΡΠ°Π·ΠΌΠ΅ΡΠ°)!
ΠΠ°ΠΆΠ΅ΡΡΡ, ΡΡΠΎ ΠΎΡΠ΅Π½Ρ Π²ΠΎΡΡΡΠ΅Π±ΠΎΠ²Π°Π½Π½Π°Ρ ΡΡΠ½ΠΊΡΠΈΡ, Π½ΠΎ Ρ Π½Π΅ ΡΠΌΠΎΠ³ Π½Π°ΠΉΡΠΈ Π½ΠΈ ΠΎΠ΄Π½ΠΎΠ³ΠΎ ΡΠ°Π±ΠΎΡΠ°ΡΡΠ΅Π³ΠΎ ΠΏΡΠΈΠΌΠ΅ΡΠ°.
ΡΡΠΎ ΡΠ°Π±ΠΎΡΠ°Π΅Ρ Π΄Π»Ρ ΠΌΠ΅Π½Ρ, ΡΡΠΎ ΡΠΌΠ΅Π½ΡΡΠΈΡ ΡΠ°Π·ΠΌΠ΅Ρ d3 ΠΏΡΠΈΠΌΠ΅ΡΠ½ΠΎ Π½Π° 50%
d3-ΠΌΠ°ΡΡΠΈΠ².js
d3-brush.js
d3-ΠΊΠΎΠ»Π»Π΅ΠΊΡΠΈΡ.js
d3-color.js
d3-dispatch.js
d3-Π»Π΅Π³ΠΊΠΎΡΡΡ.js
d3-format.js
d3-interpolate.js
d3-path.js
d3-ΡΠΊΠ°Π»Π°-chromatic.js
d3-ΠΌΠ°ΡΡΡΠ°Π±.js
d3-Π²ΡΠ±ΠΎΡ.js
d3-shape.js
d3-time-format.js
d3-timer.js
d3-transition.js
d3-zoom.js
ΠΠ°ΠΊ ΠΏΠ΅ΡΠ΅Π²Π΅ΡΡΠΈ ΡΠΊΠ°Π·Π°Π½Π½ΠΎΠ΅ Π²ΡΡΠ΅ Π² ΠΊΠΎΠ½ΡΠΈΠ³? Π£ ΠΊΠΎΠ³ΠΎ-Π½ΠΈΠ±ΡΠ΄Ρ Π΅ΡΡΡ ΠΏΡΠΈΠΌΠ΅Ρ?
Π‘Π°ΠΌΡΠΉ ΠΏΠΎΠ»Π΅Π·Π½ΡΠΉ ΠΊΠΎΠΌΠΌΠ΅Π½ΡΠ°ΡΠΈΠΉ
ΡΡΠΎ ΡΠ°Π±ΠΎΡΠ°Π΅Ρ Π΄Π»Ρ ΠΌΠ΅Π½Ρ, ΡΡΠΎ ΡΠΌΠ΅Π½ΡΡΠΈΡ ΡΠ°Π·ΠΌΠ΅Ρ d3 ΠΏΡΠΈΠΌΠ΅ΡΠ½ΠΎ Π½Π° 50%
d3-ΠΌΠ°ΡΡΠΈΠ².js
d3-brush.js
d3-ΠΊΠΎΠ»Π»Π΅ΠΊΡΠΈΡ.js
d3-color.js
d3-dispatch.js
d3-Π»Π΅Π³ΠΊΠΎΡΡΡ.js
d3-format.js
d3-interpolate.js
d3-path.js
d3-ΡΠΊΠ°Π»Π°-chromatic.js
d3-ΠΌΠ°ΡΡΡΠ°Π±.js
d3-Π²ΡΠ±ΠΎΡ.js
d3-shape.js
d3-time-format.js
d3-timer.js
d3-transition.js
d3-zoom.js