Skip to content

Commit 3739822

Browse files
sherotreetangweikunhustcc
authored
chore: bump version to 3.0.4 and update ECharts dependency to 6.0.0 (… (#606)
* chore: bump version to 3.0.4 and update ECharts dependency to 6.0.0 (#601) * docs: update README to reflect ECharts version support for v6.0.0 * fix: standardize formatting and improve code readability in dynamic, simple, and theme examples * chore: update npm install script --------- Co-authored-by: tangweikun <819573105@qq.com> Co-authored-by: hustcc <i@hust.cc>
1 parent 21665a5 commit 3739822

File tree

6 files changed

+132
-110
lines changed

6 files changed

+132
-110
lines changed

‎.github/workflows/build.yml‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ jobs:
1414
node-version: '20'
1515
- name: npm install
1616
run: |
17-
npm install
17+
npm install --legacy-peer-deps
1818
- name: build
1919
run: |
2020
npm run build

‎README.md‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ The simplest, and the best React wrapper for [Apache ECharts](https://github.com
77
[![Coverage](https://img.shields.io/coveralls/hustcc/echarts-for-react/master.svg)](https://coveralls.io/github/hustcc/echarts-for-react)
88
[![NPM downloads](https://img.shields.io/npm/dm/echarts-for-react.svg)](https://www.npmjs.com/package/echarts-for-react)
99
[![License](https://img.shields.io/npm/l/echarts-for-react.svg)](https://www.npmjs.com/package/echarts-for-react)
10-
![ECharts Ver](https://img.shields.io/badge/echarts-%5E3.0.0%20%7C%7C%20%5E4.0.0%20%7C%7C%20%5E5.0.0-blue.svg)
10+
![ECharts Ver](https://img.shields.io/badge/echarts-%5E3.0.0%20%7C%7C%20%5E4.0.0%20%7C%7C%20%5E5.0.0%20%5E6.0.0-blue.svg)
1111
![React Ver](https://img.shields.io/badge/React-%20%5E15.0.0%20%7C%7C%20%20%5E16.0.0%20%7C%7C%20%20%5E17.0.0-blue.svg)
1212

1313

@@ -63,7 +63,7 @@ import ReactECharts from 'echarts-for-react'; // or var ReactECharts = require(
6363

6464
Import ECharts.js modules manually to reduce bundle size
6565

66-
**With Echarts.js v5:**
66+
**With Echarts.js v5 or v6:**
6767

6868
```ts
6969
import React from 'react';

‎docs/examples/dynamic.md‎

Lines changed: 54 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -13,68 +13,88 @@ import cloneDeep from 'lodash.clonedeep';
1313
const Page: React.FC = () => {
1414
const DEFAULT_OPTION = {
1515
title: {
16-
text:'Hello Echarts-for-react.',
16+
text: 'Hello Echarts-for-react.',
1717
},
1818
tooltip: {
19-
trigger: 'axis'
19+
trigger: 'axis',
2020
},
2121
legend: {
22-
data:['最新成交价', '预购队列']
22+
data: ['最新成交价', '预购队列'],
2323
},
2424
toolbox: {
2525
show: true,
2626
feature: {
27-
dataView: {readOnly: false},
27+
dataView: { readOnly: false },
2828
restore: {},
29-
saveAsImage: {}
30-
}
29+
saveAsImage: {},
30+
},
3131
},
3232
grid: {
3333
top: 60,
3434
left: 30,
3535
right: 60,
36-
bottom:30
36+
bottom: 90,
3737
},
3838
dataZoom: {
3939
show: false,
4040
start: 0,
41-
end: 100
41+
end: 100,
4242
},
4343
visualMap: {
4444
show: false,
4545
min: 0,
4646
max: 1000,
47-
color: ['#BE002F', '#F20C00', '#F00056', '#FF2D51', '#FF2121', '#FF4C00', '#FF7500',
48-
'#FF8936', '#FFA400', '#F0C239', '#FFF143', '#FAFF72', '#C9DD22', '#AFDD22',
49-
'#9ED900', '#00E500', '#0EB83A', '#0AA344', '#0C8918', '#057748', '#177CB0']
47+
color: [
48+
'#BE002F',
49+
'#F20C00',
50+
'#F00056',
51+
'#FF2D51',
52+
'#FF2121',
53+
'#FF4C00',
54+
'#FF7500',
55+
'#FF8936',
56+
'#FFA400',
57+
'#F0C239',
58+
'#FFF143',
59+
'#FAFF72',
60+
'#C9DD22',
61+
'#AFDD22',
62+
'#9ED900',
63+
'#00E500',
64+
'#0EB83A',
65+
'#0AA344',
66+
'#0C8918',
67+
'#057748',
68+
'#177CB0',
69+
],
5070
},
5171
xAxis: [
5272
{
5373
type: 'category',
5474
boundaryGap: true,
55-
data: (function (){
75+
data: (function () {
5676
let now = new Date();
5777
let res = [];
5878
let len = 50;
5979
while (len--) {
60-
res.unshift(now.toLocaleTimeString().replace(/^\D*/,''));
80+
res.unshift(now.toLocaleTimeString().replace(/^\D*/, ''));
6181
now = new Date(now - 2000);
6282
}
6383
return res;
64-
})()
84+
})(),
6585
},
6686
{
6787
type: 'category',
6888
boundaryGap: true,
69-
data: (function (){
89+
data: (function () {
7090
let res = [];
7191
let len = 50;
7292
while (len--) {
7393
res.push(50 - len + 1);
7494
}
7595
return res;
76-
})()
77-
}
96+
})(),
97+
},
7898
],
7999
yAxis: [
80100
{
@@ -83,27 +103,27 @@ const Page: React.FC = () => {
83103
name: '价格',
84104
max: 20,
85105
min: 0,
86-
boundaryGap: [0.2, 0.2]
106+
boundaryGap: [0.2, 0.2],
87107
},
88108
{
89109
type: 'value',
90110
scale: true,
91111
name: '预购量',
92112
max: 1200,
93113
min: 0,
94-
boundaryGap: [0.2, 0.2]
95-
}
114+
boundaryGap: [0.2, 0.2],
115+
},
96116
],
97117
series: [
98118
{
99-
name:'预购队列',
100-
type:'bar',
119+
name: '预购队列',
120+
type: 'bar',
101121
xAxisIndex: 1,
102122
yAxisIndex: 1,
103123
itemStyle: {
104124
normal: {
105125
barBorderRadius: 4,
106-
}
126+
},
107127
},
108128
animationEasing: 'elasticOut',
109129
animationDelay: function (idx) {
@@ -112,37 +132,37 @@ const Page: React.FC = () => {
112132
animationDelayUpdate: function (idx) {
113133
return idx * 10;
114134
},
115-
data:(function (){
135+
data: (function () {
116136
let res = [];
117137
let len = 50;
118138
while (len--) {
119139
res.push(Math.round(Math.random() * 1000));
120140
}
121141
return res;
122-
})()
142+
})(),
123143
},
124144
{
125-
name:'最新成交价',
126-
type:'line',
127-
data:(function (){
145+
name: '最新成交价',
146+
type: 'line',
147+
data: (function () {
128148
let res = [];
129149
let len = 0;
130150
while (len < 50) {
131-
res.push((Math.random()*10 + 5).toFixed(1) - 0);
151+
res.push((Math.random() * 10 + 5).toFixed(1) - 0);
132152
len++;
133153
}
134154
return res;
135-
})()
136-
}
137-
]
155+
})(),
156+
},
157+
],
138158
};
139159

140160
let count;
141161

142162
const [option, setOption] = useState(DEFAULT_OPTION);
143163

144164
function fetchNewData() {
145-
const axisData = (new Date()).toLocaleTimeString().replace(/^\D*/,'');
165+
const axisData = new Date().toLocaleTimeString().replace(/^\D*/, '');
146166
const newOption = cloneDeep(option); // immutable
147167
newOption.title.text = 'Hello Echarts-for-react.' + new Date().getSeconds();
148168
const data0 = newOption.series[0].data;
@@ -168,10 +188,7 @@ const Page: React.FC = () => {
168188
return () => clearInterval(timer);
169189
});
170190

171-
return <ReactECharts
172-
option={option}
173-
style={{ height: 400 }}
174-
/>;
191+
return <ReactECharts option={option} style={{ height: 400 }} />;
175192
};
176193

177194
export default Page;

‎docs/examples/simple.md‎

Lines changed: 32 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -12,66 +12,63 @@ import ReactECharts from 'echarts-for-react';
1212
const Page: React.FC = () => {
1313
const option = {
1414
title: {
15-
text: '堆叠区域图'
15+
text: '堆叠区域图',
1616
},
17-
tooltip : {
18-
trigger: 'axis'
17+
tooltip: {
18+
trigger: 'axis',
1919
},
2020
legend: {
21-
data:['邮件营销','联盟广告','视频广告']
21+
data: ['邮件营销', '联盟广告', '视频广告'],
2222
},
2323
toolbox: {
2424
feature: {
25-
saveAsImage: {}
26-
}
25+
saveAsImage: {},
26+
},
2727
},
2828
grid: {
2929
left: '3%',
3030
right: '4%',
31-
bottom: '3%',
32-
containLabel: true
31+
bottom: '15%',
32+
containLabel: true,
3333
},
34-
xAxis : [
34+
xAxis: [
3535
{
36-
type : 'category',
37-
boundaryGap : false,
38-
data : ['周一','周二','周三','周四','周五','周六','周日']
39-
}
36+
type: 'category',
37+
boundaryGap: false,
38+
data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日'],
39+
},
4040
],
41-
yAxis : [
41+
yAxis: [
4242
{
43-
type : 'value'
44-
}
43+
type: 'value',
44+
},
4545
],
46-
series : [
46+
series: [
4747
{
48-
name:'邮件营销',
49-
type:'line',
48+
name: '邮件营销',
49+
type: 'line',
5050
stack: '总量',
51-
areaStyle: {normal: {}},
52-
data:[120, 132, 101, 134, 90, 230, 210]
51+
areaStyle: { normal: {} },
52+
data: [120, 132, 101, 134, 90, 230, 210],
5353
},
5454
{
55-
name:'联盟广告',
56-
type:'line',
55+
name: '联盟广告',
56+
type: 'line',
5757
stack: '总量',
58-
areaStyle: {normal: {}},
59-
data:[220, 182, 191, 234, 290, 330, 310]
58+
areaStyle: { normal: {} },
59+
data: [220, 182, 191, 234, 290, 330, 310],
6060
},
6161
{
62-
name:'视频广告',
63-
type:'line',
62+
name: '视频广告',
63+
type: 'line',
6464
stack: '总量',
65-
areaStyle: {normal: {}},
66-
data:[150, 232, 201, 154, 190, 330, 410]
67-
}
68-
]
65+
areaStyle: { normal: {} },
66+
data: [150, 232, 201, 154, 190, 330, 410],
67+
},
68+
],
6969
};
7070

71-
return <ReactECharts
72-
option={option}
73-
style={{ height: 400 }}
74-
/>;
71+
return <ReactECharts option={option} style={{ height: 400 }} />;
7572
};
7673

7774
export default Page;

0 commit comments

Comments
 (0)