@semcore/d3-chart 1.5.5 → 1.6.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +22 -0
- package/lib/cjs/Area.js +9 -9
- package/lib/cjs/Area.js.map +1 -1
- package/lib/cjs/Axis.js +12 -12
- package/lib/cjs/Bar.js +8 -8
- package/lib/cjs/Bar.js.map +1 -1
- package/lib/cjs/Bubble.js +276 -0
- package/lib/cjs/Bubble.js.map +1 -0
- package/lib/cjs/Donut.js +77 -64
- package/lib/cjs/Donut.js.map +1 -1
- package/lib/cjs/Dots.js +8 -7
- package/lib/cjs/Dots.js.map +1 -1
- package/lib/cjs/GroupBar.js +6 -5
- package/lib/cjs/GroupBar.js.map +1 -1
- package/lib/cjs/HorizontalBar.js +8 -8
- package/lib/cjs/HorizontalBar.js.map +1 -1
- package/lib/cjs/Hover.js +3 -3
- package/lib/cjs/Line.js +8 -8
- package/lib/cjs/Line.js.map +1 -1
- package/lib/cjs/ScatterPlot.js +224 -0
- package/lib/cjs/ScatterPlot.js.map +1 -0
- package/lib/cjs/StackBar.js +6 -5
- package/lib/cjs/StackBar.js.map +1 -1
- package/lib/cjs/StackedArea.js +7 -6
- package/lib/cjs/StackedArea.js.map +1 -1
- package/lib/cjs/Tooltip.js +19 -15
- package/lib/cjs/Tooltip.js.map +1 -1
- package/lib/cjs/Venn.js +8 -8
- package/lib/cjs/Venn.js.map +1 -1
- package/lib/cjs/color.js +32 -30
- package/lib/cjs/color.js.map +1 -1
- package/lib/cjs/index.js +16 -0
- package/lib/cjs/index.js.map +1 -1
- package/lib/cjs/style/area.shadow.css +12 -2
- package/lib/cjs/style/bar.shadow.css +7 -2
- package/lib/cjs/style/bubble.shadow.css +45 -0
- package/lib/cjs/style/donut.shadow.css +15 -0
- package/lib/cjs/style/dot.shadow.css +6 -1
- package/lib/cjs/style/line.shadow.css +6 -1
- package/lib/cjs/style/scatterplot.shadow.css +27 -0
- package/lib/cjs/style/tooltip.shadow.css +7 -2
- package/lib/cjs/style/var.css +32 -0
- package/lib/cjs/style/venn.shadow.css +7 -1
- package/lib/es6/Area.js +9 -9
- package/lib/es6/Area.js.map +1 -1
- package/lib/es6/Axis.js +12 -12
- package/lib/es6/Bar.js +8 -8
- package/lib/es6/Bar.js.map +1 -1
- package/lib/es6/Bubble.js +259 -0
- package/lib/es6/Bubble.js.map +1 -0
- package/lib/es6/Donut.js +77 -64
- package/lib/es6/Donut.js.map +1 -1
- package/lib/es6/Dots.js +8 -7
- package/lib/es6/Dots.js.map +1 -1
- package/lib/es6/GroupBar.js +6 -5
- package/lib/es6/GroupBar.js.map +1 -1
- package/lib/es6/HorizontalBar.js +8 -8
- package/lib/es6/HorizontalBar.js.map +1 -1
- package/lib/es6/Hover.js +3 -3
- package/lib/es6/Line.js +8 -8
- package/lib/es6/Line.js.map +1 -1
- package/lib/es6/ScatterPlot.js +209 -0
- package/lib/es6/ScatterPlot.js.map +1 -0
- package/lib/es6/StackBar.js +6 -5
- package/lib/es6/StackBar.js.map +1 -1
- package/lib/es6/StackedArea.js +7 -6
- package/lib/es6/StackedArea.js.map +1 -1
- package/lib/es6/Tooltip.js +18 -14
- package/lib/es6/Tooltip.js.map +1 -1
- package/lib/es6/Venn.js +8 -8
- package/lib/es6/Venn.js.map +1 -1
- package/lib/es6/color.js +33 -31
- package/lib/es6/color.js.map +1 -1
- package/lib/es6/index.js +2 -0
- package/lib/es6/index.js.map +1 -1
- package/lib/es6/style/area.shadow.css +12 -2
- package/lib/es6/style/bar.shadow.css +7 -2
- package/lib/es6/style/bubble.shadow.css +45 -0
- package/lib/es6/style/donut.shadow.css +15 -0
- package/lib/es6/style/dot.shadow.css +6 -1
- package/lib/es6/style/line.shadow.css +6 -1
- package/lib/es6/style/scatterplot.shadow.css +27 -0
- package/lib/es6/style/tooltip.shadow.css +7 -2
- package/lib/es6/style/var.css +32 -0
- package/lib/es6/style/venn.shadow.css +7 -1
- package/lib/types/Bubble.d.ts +27 -0
- package/lib/types/ScatterPlot.d.ts +27 -0
- package/lib/types/index.d.ts +6 -0
- package/package.json +2 -2
- package/src/Area.js +0 -1
- package/src/Bar.js +0 -1
- package/src/Bubble.js +189 -0
- package/src/Donut.js +8 -7
- package/src/HorizontalBar.js +0 -1
- package/src/Line.js +0 -1
- package/src/ScatterPlot.js +130 -0
- package/src/Tooltip.js +12 -6
- package/src/Venn.js +1 -1
- package/src/color.js +6 -32
- package/src/index.js +2 -0
- package/src/style/area.shadow.css +12 -2
- package/src/style/bar.shadow.css +7 -2
- package/src/style/bubble.shadow.css +45 -0
- package/src/style/donut.shadow.css +15 -0
- package/src/style/dot.shadow.css +6 -1
- package/src/style/line.shadow.css +6 -1
- package/src/style/scatterplot.shadow.css +27 -0
- package/src/style/tooltip.shadow.css +7 -2
- package/src/style/var.css +32 -0
- package/src/style/venn.shadow.css +7 -1
- package/src/types/Bubble.d.ts +27 -0
- package/src/types/ScatterPlot.d.ts +27 -0
- package/src/types/index.d.ts +6 -0
package/lib/cjs/color.js
CHANGED
|
@@ -5,37 +5,39 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
});
|
|
6
6
|
exports["default"] = getColor;
|
|
7
7
|
exports.colors = void 0;
|
|
8
|
+
|
|
9
|
+
/*__semcore-vars__:"./style/var.css"*/
|
|
8
10
|
var colors = {
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
11
|
+
"blue-01": "#50aef4",
|
|
12
|
+
"blue-02": "#91c7ef",
|
|
13
|
+
"blue-03": "#0e75c2",
|
|
14
|
+
"blue-04": "#d1e8f8",
|
|
15
|
+
"blue-05": "#084c80",
|
|
16
|
+
"green-01": "#3ab011",
|
|
17
|
+
"green-02": "#91d27b",
|
|
18
|
+
"green-03": "#278707",
|
|
19
|
+
"green-04": "#d1edc8",
|
|
20
|
+
"green-05": "#1a6700",
|
|
21
|
+
"orange-01": "#ff8e29",
|
|
22
|
+
"orange-02": "#fec089",
|
|
23
|
+
"orange-03": "#da6905",
|
|
24
|
+
"orange-04": "#ffe5cd",
|
|
25
|
+
"orange-05": "#a14e03",
|
|
26
|
+
"violet-01": "#890c85",
|
|
27
|
+
"violet-02": "#c783c5",
|
|
28
|
+
"violet-03": "#6e026b",
|
|
29
|
+
"violet-04": "#e7cbe6",
|
|
30
|
+
"violet-05": "#4d024b",
|
|
31
|
+
"red-01": "#e91e25",
|
|
32
|
+
"red-02": "#f69498",
|
|
33
|
+
"red-03": "#bd0000",
|
|
34
|
+
"red-04": "#fbd2d3",
|
|
35
|
+
"red-05": "#830005",
|
|
36
|
+
"yellow-01": "#ffc83f",
|
|
37
|
+
"yellow-02": "#ffdb82",
|
|
38
|
+
"yellow-03": "#e4aa18",
|
|
39
|
+
"yellow-04": "#ffebb9",
|
|
40
|
+
"yellow-05": "#b3840c"
|
|
39
41
|
};
|
|
40
42
|
exports.colors = colors;
|
|
41
43
|
var componentRenderIndex = 0;
|
package/lib/cjs/color.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/color.js"],"names":["colors","componentRenderIndex","cache","colorValues","Object","keys","sort","a","b","parseInt","match","join","getColor","key","color"],"mappings":"
|
|
1
|
+
{"version":3,"sources":["../../src/color.js"],"names":["colors","componentRenderIndex","cache","colorValues","Object","keys","sort","a","b","parseInt","match","join","getColor","key","color"],"mappings":";;;;;;;;AAAA;AACA,IAAMA,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,CAAZ;;AAKA,IAAIC,oBAAoB,GAAG,CAA3B;AACA,IAAMC,KAAK,GAAG,EAAd;AACA,IAAMC,WAAW,GAAGC,MAAM,CAACC,IAAP,CAAYL,MAAZ,EAAoBM,IAApB,CAAyB,UAACC,CAAD,EAAIC,CAAJ,EAAU;AACrD,SAAOC,QAAQ,CAACF,CAAC,CAACG,KAAF,CAAQ,QAAR,EAAkBC,IAAlB,CAAuB,EAAvB,CAAD,EAA6B,EAA7B,CAAR,GAA2CF,QAAQ,CAACD,CAAC,CAACE,KAAF,CAAQ,QAAR,EAAkBC,IAAlB,CAAuB,EAAvB,CAAD,EAA6B,EAA7B,CAA1D;AACD,CAFmB,CAApB;;AAKe,SAASC,QAAT,CAAkBC,GAAlB,EAAuB;AACpC,MAAIX,KAAK,CAACW,GAAD,CAAT,EAAgB;AACd,WAAOX,KAAK,CAACW,GAAD,CAAZ;AACD;;AACD,MAAMC,KAAK,GAAGd,MAAM,CAACG,WAAW,CAACF,oBAAoB,EAArB,CAAZ,CAApB;AACAC,EAAAA,KAAK,CAACW,GAAD,CAAL,GAAaC,KAAb;AACA,SAAOA,KAAP;AACD","sourcesContent":["/*__semcore-vars__:\"./style/var.css\"*/\nconst colors = preval`\n const path = require('path');\n module.exports = require('@semcore/babel-plugin-react-semcore/utils/vars')(path.resolve(__dirname, './style/var.css'));\n`;\n\nlet componentRenderIndex = 0;\nconst cache = {};\nconst colorValues = Object.keys(colors).sort((a, b) => {\n return parseInt(a.match(/[0-9]/g).join(''), 10) - parseInt(b.match(/[0-9]/g).join(''), 10);\n});\n\nexport { colors };\nexport default function getColor(key) {\n if (cache[key]) {\n return cache[key];\n }\n const color = colors[colorValues[componentRenderIndex++]];\n cache[key] = color;\n return color;\n}\n"],"file":"color.js"}
|
package/lib/cjs/index.js
CHANGED
|
@@ -65,6 +65,18 @@ Object.defineProperty(exports, "StackedArea", {
|
|
|
65
65
|
return _StackedArea["default"];
|
|
66
66
|
}
|
|
67
67
|
});
|
|
68
|
+
Object.defineProperty(exports, "ScatterPlot", {
|
|
69
|
+
enumerable: true,
|
|
70
|
+
get: function get() {
|
|
71
|
+
return _ScatterPlot["default"];
|
|
72
|
+
}
|
|
73
|
+
});
|
|
74
|
+
Object.defineProperty(exports, "Bubble", {
|
|
75
|
+
enumerable: true,
|
|
76
|
+
get: function get() {
|
|
77
|
+
return _Bubble["default"];
|
|
78
|
+
}
|
|
79
|
+
});
|
|
68
80
|
Object.defineProperty(exports, "Donut", {
|
|
69
81
|
enumerable: true,
|
|
70
82
|
get: function get() {
|
|
@@ -132,6 +144,10 @@ var _Area = _interopRequireDefault(require("./Area"));
|
|
|
132
144
|
|
|
133
145
|
var _StackedArea = _interopRequireDefault(require("./StackedArea"));
|
|
134
146
|
|
|
147
|
+
var _ScatterPlot = _interopRequireDefault(require("./ScatterPlot"));
|
|
148
|
+
|
|
149
|
+
var _Bubble = _interopRequireDefault(require("./Bubble"));
|
|
150
|
+
|
|
135
151
|
var _Donut = _interopRequireDefault(require("./Donut"));
|
|
136
152
|
|
|
137
153
|
var _Venn = _interopRequireDefault(require("./Venn"));
|
package/lib/cjs/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/index.js"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"sources":["../../src/index.js"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AAEA;;AAEA;;AAEA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AAEA;;AAEA;;AAEA;;AAEA;;AACA","sourcesContent":["export { default as Plot } from './Plot';\n\nexport { XAxis, YAxis } from './Axis';\n\nexport { default as Line } from './Line';\n\nexport { default as Bar } from './Bar';\nexport { default as HorizontalBar } from './HorizontalBar';\nexport { default as GroupBar } from './GroupBar';\nexport { default as StackBar } from './StackBar';\nexport { default as Area } from './Area';\nexport { default as StackedArea } from './StackedArea';\nexport { default as ScatterPlot } from './ScatterPlot';\nexport { default as Bubble } from './Bubble';\nexport { default as Donut } from './Donut';\nexport { default as Venn } from './Venn';\n\nexport { default as Tooltip } from './Tooltip';\n\nexport { default as ResponsiveContainer } from './ResponsiveContainer';\n\nexport { HoverLine, HoverRect } from './Hover';\n\nexport { minMax } from './utils';\nexport { colors } from './color';\n"],"file":"index.js"}
|
|
@@ -1,14 +1,24 @@
|
|
|
1
|
+
@import '@semcore/d3-chart/src/style/var.css';
|
|
2
|
+
|
|
1
3
|
SArea {
|
|
2
|
-
fill: var(--
|
|
4
|
+
fill: var(--blue-01);
|
|
3
5
|
fill-opacity: 0.4;
|
|
4
6
|
}
|
|
5
7
|
|
|
8
|
+
SArea[color] {
|
|
9
|
+
fill: var(--color);
|
|
10
|
+
}
|
|
11
|
+
|
|
6
12
|
SAreaLine {
|
|
7
|
-
stroke: var(--
|
|
13
|
+
stroke: var(--blue-01);
|
|
8
14
|
stroke-width: 3;
|
|
9
15
|
fill: transparent;
|
|
10
16
|
}
|
|
11
17
|
|
|
18
|
+
SAreaLine[color] {
|
|
19
|
+
stroke: var(--color);
|
|
20
|
+
}
|
|
21
|
+
|
|
12
22
|
SArea,
|
|
13
23
|
SAreaLine {
|
|
14
24
|
transition-property: d;
|
|
@@ -1,16 +1,21 @@
|
|
|
1
1
|
@import '@semcore/utils/style/var.css';
|
|
2
|
+
@import '@semcore/d3-chart/src/style/var.css';
|
|
2
3
|
|
|
3
4
|
SBar {
|
|
4
|
-
fill: var(--
|
|
5
|
+
fill: var(--blue-01);
|
|
5
6
|
transition-property: height, width, y;
|
|
6
7
|
transition-duration: var(--duration);
|
|
7
8
|
transition-timing-function: ease-in-out;
|
|
8
9
|
}
|
|
9
10
|
|
|
11
|
+
SBar[color] {
|
|
12
|
+
fill: var(--color);
|
|
13
|
+
}
|
|
14
|
+
|
|
10
15
|
SBar[hide] {
|
|
11
16
|
display: none;
|
|
12
17
|
}
|
|
13
18
|
|
|
14
19
|
SBackground {
|
|
15
|
-
fill:
|
|
20
|
+
fill: var(--mystic);
|
|
16
21
|
}
|
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
@import '@semcore/utils/style/var.css';
|
|
2
|
+
@import '@semcore/d3-chart/src/style/var.css';
|
|
3
|
+
|
|
4
|
+
SBubble {
|
|
5
|
+
fill: #2bb3ff;
|
|
6
|
+
stroke: #fff;
|
|
7
|
+
stroke-width: 2px;
|
|
8
|
+
transition-property: cx, cy;
|
|
9
|
+
transition-duration: var(--duration);
|
|
10
|
+
transition-timing-function: ease-in-out;
|
|
11
|
+
opacity: 0.5;
|
|
12
|
+
&:hover {
|
|
13
|
+
opacity: 0.8;
|
|
14
|
+
}
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
SBubble[color] {
|
|
18
|
+
fill: var(--color);
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
SCenter {
|
|
22
|
+
text-anchor: middle;
|
|
23
|
+
font-size: 11px;
|
|
24
|
+
stroke: #2bb3ff;
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
SCenter[color] {
|
|
28
|
+
stroke: var(--color);
|
|
29
|
+
}
|
|
30
|
+
|
|
31
|
+
SLabel {
|
|
32
|
+
fill: #2bb3ff;
|
|
33
|
+
}
|
|
34
|
+
|
|
35
|
+
SLabel[position='right'] {
|
|
36
|
+
text-anchor: end;
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
SLabel[position='left'] {
|
|
40
|
+
text-anchor: start;
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
SLabel[color] {
|
|
44
|
+
fill: var(--color);
|
|
45
|
+
}
|
|
@@ -1,5 +1,20 @@
|
|
|
1
|
+
@import '@semcore/utils/style/var.css';
|
|
2
|
+
@import '@semcore/d3-chart/src/style/var.css';
|
|
3
|
+
|
|
1
4
|
SPie {
|
|
2
5
|
stroke: #ffffff;
|
|
6
|
+
fill: var(--blue-01);
|
|
7
|
+
}
|
|
8
|
+
|
|
9
|
+
SPie[color] {
|
|
10
|
+
fill: var(--color);
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
SEmptyData {
|
|
14
|
+
fill: var(--mystic);
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
SEmptyData[color] {
|
|
3
18
|
fill: var(--color);
|
|
4
19
|
}
|
|
5
20
|
|
|
@@ -1,15 +1,20 @@
|
|
|
1
1
|
@import '@semcore/utils/style/var.css';
|
|
2
|
+
@import '@semcore/d3-chart/src/style/var.css';
|
|
2
3
|
|
|
3
4
|
SDot {
|
|
4
5
|
stroke-width: 2px;
|
|
5
6
|
stroke: #fff;
|
|
6
7
|
r: 6px;
|
|
7
|
-
fill: var(--
|
|
8
|
+
fill: var(--blue-01);
|
|
8
9
|
transition-property: cx, cy;
|
|
9
10
|
transition-duration: var(--duration);
|
|
10
11
|
transition-timing-function: ease-in-out;
|
|
11
12
|
}
|
|
12
13
|
|
|
14
|
+
SDot[color] {
|
|
15
|
+
fill: var(--color);
|
|
16
|
+
}
|
|
17
|
+
|
|
13
18
|
SDot[hide] {
|
|
14
19
|
display: none;
|
|
15
20
|
}
|
|
@@ -1,14 +1,19 @@
|
|
|
1
1
|
@import '@semcore/utils/style/var.css';
|
|
2
|
+
@import '@semcore/d3-chart/src/style/var.css';
|
|
2
3
|
|
|
3
4
|
SLine {
|
|
4
5
|
fill: transparent;
|
|
5
6
|
stroke-width: 3;
|
|
6
|
-
stroke: var(--
|
|
7
|
+
stroke: var(--blue-01);
|
|
7
8
|
transition-property: d;
|
|
8
9
|
transition-duration: var(--duration);
|
|
9
10
|
transition-timing-function: ease-in-out;
|
|
10
11
|
}
|
|
11
12
|
|
|
13
|
+
SLine[color] {
|
|
14
|
+
stroke: var(--color);
|
|
15
|
+
}
|
|
16
|
+
|
|
12
17
|
SLine[hide] {
|
|
13
18
|
display: none;
|
|
14
19
|
}
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
@import '@semcore/utils/style/var.css';
|
|
2
|
+
@import '@semcore/d3-chart/src/style/var.css';
|
|
3
|
+
|
|
4
|
+
SScatterPlot {
|
|
5
|
+
fill: #2bb3ff;
|
|
6
|
+
transition-property: cx, cy;
|
|
7
|
+
transition-duration: var(--duration);
|
|
8
|
+
transition-timing-function: ease-in-out;
|
|
9
|
+
opacity: 0.5;
|
|
10
|
+
&:hover {
|
|
11
|
+
opacity: 0.8;
|
|
12
|
+
}
|
|
13
|
+
}
|
|
14
|
+
|
|
15
|
+
SScatterPlot[color] {
|
|
16
|
+
fill: var(--color);
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
SValue {
|
|
20
|
+
text-anchor: middle;
|
|
21
|
+
font-size: 10px;
|
|
22
|
+
stroke: #008ff8;
|
|
23
|
+
}
|
|
24
|
+
|
|
25
|
+
SValue[color] {
|
|
26
|
+
stroke: var(--color);
|
|
27
|
+
}
|
|
@@ -1,6 +1,9 @@
|
|
|
1
1
|
@import '@semcore/utils/style/var.css';
|
|
2
|
+
@import '@semcore/d3-chart/src/style/var.css';
|
|
2
3
|
|
|
3
4
|
STooltip {
|
|
5
|
+
font-size: var(--fs-100);
|
|
6
|
+
line-height: var(--lh-100);
|
|
4
7
|
position: relative;
|
|
5
8
|
background-color: #fff;
|
|
6
9
|
border-radius: 3px;
|
|
@@ -11,8 +14,6 @@ STooltip {
|
|
|
11
14
|
}
|
|
12
15
|
|
|
13
16
|
STitle {
|
|
14
|
-
font-size: var(--fs-100);
|
|
15
|
-
line-height: var(--lh-100);
|
|
16
17
|
color: var(--gray60);
|
|
17
18
|
margin-bottom: 8px;
|
|
18
19
|
}
|
|
@@ -27,5 +28,9 @@ SDot {
|
|
|
27
28
|
height: 8px;
|
|
28
29
|
border-radius: 50%;
|
|
29
30
|
margin-right: 8px;
|
|
31
|
+
background: var(--blue-01);
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
SDot[color] {
|
|
30
35
|
background: var(--color);
|
|
31
36
|
}
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
:root {
|
|
2
|
+
--blue-01: #50aef4;
|
|
3
|
+
--blue-02: #91c7ef;
|
|
4
|
+
--blue-03: #0e75c2;
|
|
5
|
+
--blue-04: #d1e8f8;
|
|
6
|
+
--blue-05: #084c80;
|
|
7
|
+
--green-01: #3ab011;
|
|
8
|
+
--green-02: #91d27b;
|
|
9
|
+
--green-03: #278707;
|
|
10
|
+
--green-04: #d1edc8;
|
|
11
|
+
--green-05: #1a6700;
|
|
12
|
+
--orange-01: #ff8e29;
|
|
13
|
+
--orange-02: #fec089;
|
|
14
|
+
--orange-03: #da6905;
|
|
15
|
+
--orange-04: #ffe5cd;
|
|
16
|
+
--orange-05: #a14e03;
|
|
17
|
+
--violet-01: #890c85;
|
|
18
|
+
--violet-02: #c783c5;
|
|
19
|
+
--violet-03: #6e026b;
|
|
20
|
+
--violet-04: #e7cbe6;
|
|
21
|
+
--violet-05: #4d024b;
|
|
22
|
+
--red-01: #e91e25;
|
|
23
|
+
--red-02: #f69498;
|
|
24
|
+
--red-03: #bd0000;
|
|
25
|
+
--red-04: #fbd2d3;
|
|
26
|
+
--red-05: #830005;
|
|
27
|
+
--yellow-01: #ffc83f;
|
|
28
|
+
--yellow-02: #ffdb82;
|
|
29
|
+
--yellow-03: #e4aa18;
|
|
30
|
+
--yellow-04: #ffebb9;
|
|
31
|
+
--yellow-05: #b3840c;
|
|
32
|
+
}
|
|
@@ -1,5 +1,7 @@
|
|
|
1
|
+
@import '@semcore/d3-chart/src/style/var.css';
|
|
2
|
+
|
|
1
3
|
SCircle {
|
|
2
|
-
fill: var(--
|
|
4
|
+
fill: var(--green-01);
|
|
3
5
|
stroke: #fff;
|
|
4
6
|
stroke-width: 2px;
|
|
5
7
|
fill-opacity: 0.5;
|
|
@@ -12,6 +14,10 @@ SCircle {
|
|
|
12
14
|
}
|
|
13
15
|
}
|
|
14
16
|
|
|
17
|
+
SCircle[color] {
|
|
18
|
+
fill: var(--color);
|
|
19
|
+
}
|
|
20
|
+
|
|
15
21
|
SIntersection {
|
|
16
22
|
stroke: #fff;
|
|
17
23
|
stroke-width: 2px;
|
package/lib/es6/Area.js
CHANGED
|
@@ -25,17 +25,18 @@ var style = (
|
|
|
25
25
|
/*__reshadow_css_start__*/
|
|
26
26
|
_sstyled.insert(
|
|
27
27
|
/*__inner_css_start__*/
|
|
28
|
-
".
|
|
28
|
+
".___SArea_tpt45_gg_{fill:#50aef4;fill-opacity:.4}.___SArea_tpt45_gg_.__color_tpt45_gg_{fill:var(--color_clbofp)}.___SAreaLine_tpt45_gg_{stroke:#50aef4;stroke-width:3;fill:transparent}.___SAreaLine_tpt45_gg_.__color_tpt45_gg_{stroke:var(--color_clbofp)}.___SArea_tpt45_gg_,.___SAreaLine_tpt45_gg_{transition-property:d;transition-duration:var(--duration_clbofp);transition-timing-function:ease-in-out}.___SNull_tpt45_gg_{fill:transparent;stroke:#bdc4c6;stroke-dasharray:4}.___SNull_tpt45_gg_.__hide_tpt45_gg_{display:none}"
|
|
29
29
|
/*__inner_css_end__*/
|
|
30
|
-
, "
|
|
30
|
+
, "clbofp_gg_")
|
|
31
31
|
/*__reshadow_css_end__*/
|
|
32
32
|
, {
|
|
33
|
-
"__SArea": "
|
|
34
|
-
"
|
|
35
|
-
"
|
|
36
|
-
"
|
|
37
|
-
"
|
|
38
|
-
"
|
|
33
|
+
"__SArea": "___SArea_tpt45_gg_",
|
|
34
|
+
"_color": "__color_tpt45_gg_",
|
|
35
|
+
"--color": "--color_clbofp",
|
|
36
|
+
"__SAreaLine": "___SAreaLine_tpt45_gg_",
|
|
37
|
+
"--duration": "--duration_clbofp",
|
|
38
|
+
"__SNull": "___SNull_tpt45_gg_",
|
|
39
|
+
"_hide": "__hide_tpt45_gg_"
|
|
39
40
|
});
|
|
40
41
|
|
|
41
42
|
var AreaRoot = /*#__PURE__*/function (_Component) {
|
|
@@ -161,7 +162,6 @@ _defineProperty(AreaRoot, "defaultProps", function (_ref3) {
|
|
|
161
162
|
}).y(function (p) {
|
|
162
163
|
return scaleOfBandwidth(yScale, p[y]);
|
|
163
164
|
}),
|
|
164
|
-
color: '#50aef4',
|
|
165
165
|
duration: 500
|
|
166
166
|
};
|
|
167
167
|
});
|
package/lib/es6/Area.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/Area.js"],"names":["React","area","curveLinear","line","Dots","Component","sstyled","createElement","definedData","scaleOfBandwidth","getNullData","definedNullData","ClipPath","uniqueIDEnhancement","AreaRoot","asProps","x","y","color","data","d3Line","d3","SArea","Element","SAreaLine","styles","hide","uid","size","duration","rect","setAttribute","style","y0","$rootProps","curve","scale","xScale","yScale","yRange","range","defined","p","y1","Null","props","SNull"],"mappings":";;;;;;;;;;;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,IAAT,EAAeC,WAAf,EAA4BC,IAA5B,QAAwC,UAAxC;AACA,OAAOC,IAAP,MAAiB,QAAjB;AACA,SAASC,SAAT,EAAoBC,OAApB,QAAmC,eAAnC;AACA,OAAOC,aAAP,MAA0B,iBAA1B;AACA,SAASC,WAAT,EAAsBC,gBAAtB,EAAwCC,WAAxC,EAAqDC,eAArD,QAA4E,SAA5E;AACA,OAAOC,QAAP,MAAqB,YAArB;AACA,OAAOC,mBAAP,MAAgC,6BAAhC
|
|
1
|
+
{"version":3,"sources":["../../src/Area.js"],"names":["React","area","curveLinear","line","Dots","Component","sstyled","createElement","definedData","scaleOfBandwidth","getNullData","definedNullData","ClipPath","uniqueIDEnhancement","AreaRoot","asProps","x","y","color","data","d3Line","d3","SArea","Element","SAreaLine","styles","hide","uid","size","duration","rect","setAttribute","style","y0","$rootProps","curve","scale","xScale","yScale","yRange","range","defined","p","y1","Null","props","SNull"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { area, curveLinear, line } from 'd3-shape';\nimport Dots from './Dots';\nimport { Component, sstyled } from '@semcore/core';\nimport createElement from './createElement';\nimport { definedData, scaleOfBandwidth, getNullData, definedNullData } from './utils';\nimport ClipPath from './ClipPath';\nimport uniqueIDEnhancement from '@semcore/utils/lib/uniqueID';\n\nimport style from './style/area.shadow.css';\n\nclass AreaRoot extends Component {\n static displayName = 'Area';\n static style = style;\n static enhance = [uniqueIDEnhancement()];\n\n static defaultProps = ({ x, y, y0, $rootProps, curve = curveLinear, scale }) => {\n const [xScale, yScale] = scale || $rootProps.scale;\n const yRange = yScale.range();\n\n return {\n d3: area()\n .defined(definedData(x, y))\n .curve(curve)\n .x((p) => scaleOfBandwidth(xScale, p[x]))\n .y0((p) => (p[y0] ? scaleOfBandwidth(yScale, p[y0]) : yRange[0]))\n .y1((p) => scaleOfBandwidth(yScale, p[y])),\n d3Line: line()\n .defined(definedData(x, y))\n .curve(curve)\n .x((p) => scaleOfBandwidth(xScale, p[x]))\n .y((p) => scaleOfBandwidth(yScale, p[y])),\n duration: 500,\n };\n };\n\n getDotsProps() {\n const { x, y, color, data, d3Line } = this.asProps;\n\n return {\n x,\n y,\n data,\n d3: d3Line,\n color,\n };\n }\n\n getNullProps() {\n const { x, y, color, data, d3Line } = this.asProps;\n return {\n data: getNullData(data, definedNullData(x, y), y),\n d3: d3Line,\n color,\n };\n }\n\n render() {\n const SArea = this.Element;\n const SAreaLine = 'path';\n const { styles, hide, d3, d3Line, data, color, uid, size, duration } = this.asProps;\n return sstyled(styles)(\n <>\n <SAreaLine\n clipPath={`url(#${uid})`}\n d={d3Line(data)}\n color={color}\n use:duration={`${duration}ms`}\n />\n <SArea\n clipPath={`url(#${uid})`}\n render=\"path\"\n d={d3(data)}\n hide={hide}\n color={color}\n use:duration={`${duration}ms`}\n />\n {duration && (\n <ClipPath\n setAttributeTag={(rect) => {\n rect.setAttribute('width', size[0]);\n }}\n id={uid}\n x=\"0\"\n y=\"0\"\n width={0}\n height={size[1]}\n transition={`width ${duration}ms ease-in-out`}\n />\n )}\n </>,\n );\n }\n}\n\nfunction Null(props) {\n const { Element: SNull, styles, d3, data, hide, color } = props;\n return sstyled(styles)(<SNull render=\"path\" d={d3(data)} hide={hide} color={color} />);\n}\n\nexport default createElement(AreaRoot, {\n Dots,\n Null,\n});\n"],"file":"Area.js"}
|
package/lib/es6/Axis.js
CHANGED
|
@@ -27,22 +27,22 @@ var style = (
|
|
|
27
27
|
/*__reshadow_css_start__*/
|
|
28
28
|
_sstyled.insert(
|
|
29
29
|
/*__inner_css_start__*/
|
|
30
|
-
".
|
|
30
|
+
".___SAxis_jwdop_gg_{stroke:#a6b0b3}.___SAxis_jwdop_gg_.__hide_jwdop_gg_{display:none}.___STick_jwdop_gg_{font-size:12px;fill:#757575}.___STick_jwdop_gg_.__hide_jwdop_gg_{display:none}.___SGrid_jwdop_gg_{fill:transparent;stroke:#dee3e5}.___STitle_jwdop_gg_{font-size:12px;fill:#757575;transform-origin:center}.___STitle_jwdop_gg_._position_top_jwdop_gg_{text-anchor:middle;transform:translateY(-16px)}.___STitle_jwdop_gg_._position_bottom_jwdop_gg_{text-anchor:middle;alignment-baseline:hanging;transform:translateY(16px)}.___STitle_jwdop_gg_._position_left_jwdop_gg_,.___STitle_jwdop_gg_._position_right_jwdop_gg_{transform:rotate(-90deg);transform-box:fill-box;alignment-baseline:middle}.___STitle_jwdop_gg_._position_left_jwdop_gg_{text-anchor:end}.___STick_jwdop_gg_._position_top_jwdop_gg_{transform:translateY(-12px);text-anchor:middle}.___STick_jwdop_gg_._position_bottom_jwdop_gg_{transform:translateY(12px);text-anchor:middle;alignment-baseline:hanging}.___STick_jwdop_gg_._position_right_jwdop_gg_{transform:translateX(16px);text-anchor:start;alignment-baseline:middle}.___STick_jwdop_gg_._position_left_jwdop_gg_{transform:translateX(-16px);text-anchor:end;alignment-baseline:middle}.___STick_jwdop_gg_._position_custom_0_jwdop_gg_{transform:translateY(12px);text-anchor:middle;alignment-baseline:hanging}.___STick_jwdop_gg_._position_custom_1_jwdop_gg_{transform:translateX(-16px);text-anchor:end;alignment-baseline:middle}"
|
|
31
31
|
/*__inner_css_end__*/
|
|
32
32
|
, "8vu5zg_gg_")
|
|
33
33
|
/*__reshadow_css_end__*/
|
|
34
34
|
, {
|
|
35
|
-
"__SAxis": "
|
|
36
|
-
"_hide": "
|
|
37
|
-
"__STick": "
|
|
38
|
-
"__SGrid": "
|
|
39
|
-
"__STitle": "
|
|
40
|
-
"_position_top": "
|
|
41
|
-
"_position_bottom": "
|
|
42
|
-
"_position_left": "
|
|
43
|
-
"_position_right": "
|
|
44
|
-
"_position_custom_0": "
|
|
45
|
-
"_position_custom_1": "
|
|
35
|
+
"__SAxis": "___SAxis_jwdop_gg_",
|
|
36
|
+
"_hide": "__hide_jwdop_gg_",
|
|
37
|
+
"__STick": "___STick_jwdop_gg_",
|
|
38
|
+
"__SGrid": "___SGrid_jwdop_gg_",
|
|
39
|
+
"__STitle": "___STitle_jwdop_gg_",
|
|
40
|
+
"_position_top": "_position_top_jwdop_gg_",
|
|
41
|
+
"_position_bottom": "_position_bottom_jwdop_gg_",
|
|
42
|
+
"_position_left": "_position_left_jwdop_gg_",
|
|
43
|
+
"_position_right": "_position_right_jwdop_gg_",
|
|
44
|
+
"_position_custom_0": "_position_custom_0_jwdop_gg_",
|
|
45
|
+
"_position_custom_1": "_position_custom_1_jwdop_gg_"
|
|
46
46
|
});
|
|
47
47
|
var CUSTOM_0 = Symbol('custom_0');
|
|
48
48
|
var CUSTOM_1 = Symbol('custom_1');
|
package/lib/es6/Bar.js
CHANGED
|
@@ -24,16 +24,17 @@ var style = (
|
|
|
24
24
|
/*__reshadow_css_start__*/
|
|
25
25
|
_sstyled.insert(
|
|
26
26
|
/*__inner_css_start__*/
|
|
27
|
-
".
|
|
27
|
+
".___SBar_1ezg1_gg_{fill:#50aef4;transition-property:height,width,y;transition-duration:var(--duration_6qtpvs);transition-timing-function:ease-in-out}.___SBar_1ezg1_gg_.__color_1ezg1_gg_{fill:var(--color_6qtpvs)}.___SBar_1ezg1_gg_.__hide_1ezg1_gg_{display:none}.___SBackground_1ezg1_gg_{fill:#e4ecf1}"
|
|
28
28
|
/*__inner_css_end__*/
|
|
29
|
-
, "
|
|
29
|
+
, "6qtpvs_gg_")
|
|
30
30
|
/*__reshadow_css_end__*/
|
|
31
31
|
, {
|
|
32
|
-
"__SBar": "
|
|
33
|
-
"--
|
|
34
|
-
"
|
|
35
|
-
"
|
|
36
|
-
"
|
|
32
|
+
"__SBar": "___SBar_1ezg1_gg_",
|
|
33
|
+
"--duration": "--duration_6qtpvs",
|
|
34
|
+
"_color": "__color_1ezg1_gg_",
|
|
35
|
+
"--color": "--color_6qtpvs",
|
|
36
|
+
"_hide": "__hide_1ezg1_gg_",
|
|
37
|
+
"__SBackground": "___SBackground_1ezg1_gg_"
|
|
37
38
|
});
|
|
38
39
|
|
|
39
40
|
var BarRoot = /*#__PURE__*/function (_Component) {
|
|
@@ -163,7 +164,6 @@ _defineProperty(BarRoot, "style", style);
|
|
|
163
164
|
_defineProperty(BarRoot, "enhance", [uniqueIDEnhancement()]);
|
|
164
165
|
|
|
165
166
|
_defineProperty(BarRoot, "defaultProps", {
|
|
166
|
-
color: '#50aef4',
|
|
167
167
|
offset: [0, 0],
|
|
168
168
|
duration: 500,
|
|
169
169
|
r: 2
|
package/lib/es6/Bar.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/Bar.js"],"names":["React","transition","Component","sstyled","uniqueIDEnhancement","createElement","ClipPath","getBandwidth","roundedPath","BarRoot","props","index","asProps","x","data","value","duration","uid","selectRect","selection","selectAll","selectRectNode","node","getAttribute","attr","animationBar","d","i","SBar","Element","styles","color","y","y0","scale","hide","offset","r","widthProps","width","xScale","yScale","barY","Math","max","barX","height","abs","min","domain","dSvg","getRect","radius","Array","isArray","position","size","map","renderBar","bind","style","Background","SBackground","yRange","range","bandwidth"],"mappings":";;;;;;;;;;;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,UAAT,QAA2B,eAA3B;AACA,SAASC,SAAT,EAAoBC,OAApB,QAAmC,eAAnC;AACA,OAAOC,mBAAP,MAAgC,6BAAhC;AACA,OAAOC,aAAP,MAA0B,iBAA1B;AACA,OAAOC,QAAP,MAAqB,YAArB;AACA,SAASC,YAAT,EAAuBC,WAAvB,QAA0C,SAA1C
|
|
1
|
+
{"version":3,"sources":["../../src/Bar.js"],"names":["React","transition","Component","sstyled","uniqueIDEnhancement","createElement","ClipPath","getBandwidth","roundedPath","BarRoot","props","index","asProps","x","data","value","duration","uid","selectRect","selection","selectAll","selectRectNode","node","getAttribute","attr","animationBar","d","i","SBar","Element","styles","color","y","y0","scale","hide","offset","r","widthProps","width","xScale","yScale","barY","Math","max","barX","height","abs","min","domain","dSvg","getRect","radius","Array","isArray","position","size","map","renderBar","bind","style","Background","SBackground","yRange","range","bandwidth"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { transition } from 'd3-transition';\nimport { Component, sstyled } from '@semcore/core';\nimport uniqueIDEnhancement from '@semcore/utils/lib/uniqueID';\nimport createElement from './createElement';\nimport ClipPath from './ClipPath';\nimport { getBandwidth, roundedPath } from './utils';\n\nimport style from './style/bar.shadow.css';\n\nclass BarRoot extends Component {\n static displayName = 'Bar';\n static style = style;\n static enhance = [uniqueIDEnhancement()];\n\n static defaultProps = {\n offset: [0, 0],\n duration: 500,\n r: 2,\n };\n\n getBackgroundProps(props, index) {\n const { x, data } = this.asProps;\n return {\n value: data[index][x],\n };\n }\n\n animationBar() {\n const { duration, uid } = this.asProps;\n const selectRect = transition()\n .selection()\n .selectAll(`#${uid} rect`);\n const selectRectNode = selectRect.node();\n\n if (duration > 0 && selectRectNode && selectRectNode.getAttribute('y') !== '0') {\n selectRect\n .transition()\n .duration(duration)\n .attr('y', 0);\n }\n }\n\n componentDidUpdate() {\n this.animationBar();\n }\n\n componentDidMount() {\n this.animationBar();\n }\n\n renderBar(d, i) {\n const SBar = this.Element;\n const {\n styles,\n color,\n x,\n y,\n y0,\n scale,\n hide,\n offset,\n duration,\n uid,\n r,\n width: widthProps,\n } = this.asProps;\n\n const [xScale, yScale] = scale;\n const barY = yScale(Math.max(d[y0] ?? 0, d[y])) + offset[1];\n const barX = xScale(d[x]) + offset[0];\n const height = Math.abs(\n yScale(d[y]) - Math.min(yScale(yScale.domain()[0]), yScale(d[y0] ?? 0)),\n );\n const width = widthProps || getBandwidth(xScale);\n const dSvg = getRect({\n x: barX,\n y: barY,\n width,\n height,\n radius: Array.isArray(r) ? r[i] : r,\n position: d[y] > 0 ? 'top' : 'bottom',\n });\n\n return sstyled(styles)(\n <SBar\n key={`bar-${i}`}\n render=\"path\"\n clipPath={`url(#${uid})`}\n __excludeProps={['data', 'scale', 'value']}\n childrenPosition=\"above\"\n value={d}\n index={i}\n hide={hide}\n color={color}\n x={barX}\n y={barY}\n width={width}\n height={height}\n d={dSvg}\n use:duration={`${duration}ms`}\n />,\n );\n }\n render() {\n const { data, uid, size, duration } = this.asProps;\n return (\n <>\n {data.map(this.renderBar.bind(this))}\n {duration && (\n <ClipPath\n key={`${uid}-animation`}\n id={uid}\n x=\"0\"\n y={size[1]}\n width={size[0]}\n height={`${size[1]}px`}\n />\n )}\n </>\n );\n }\n}\n\nfunction Background(props) {\n const { Element: SBackground, styles, scale, value } = props;\n\n const [xScale, yScale] = scale;\n const yRange = yScale.range();\n\n return sstyled(styles)(\n <SBackground\n render=\"rect\"\n childrenPosition=\"above\"\n width={xScale.bandwidth()}\n height={yRange[0] - yRange[1]}\n x={xScale(value)}\n y={yRange[1]}\n />,\n );\n}\n\nfunction getRect({ x, y, width, height, radius, position }) {\n if (height <= radius) return '';\n if (radius) {\n if (position === 'top')\n return roundedPath(x, y, width, height, radius, true, true, false, false);\n return roundedPath(x, y, width, height, radius, false, false, true, true);\n }\n return roundedPath(x, y, width, height, radius);\n}\n\nexport default createElement(BarRoot, { Background });\n"],"file":"Bar.js"}
|