AntV G2 tooltip 修改

1<div id="mountNode"></div>
2            <script>
3                const data = [
4                    { "date": "1", "value": 22.75, "type": "应收金额", "rate": '2016-02-01' },
5                    { "date": "1", "value": 23.44, "type": "已收金额", "rate": '2016-06-02' },
6
7                    { "date": "7", "value": 21.75, "type": "应收金额", "rate": '2016-03-01' },
8                    { "date": "7", "value": 33.44, "type": "已收金额", "rate": '2016-06-03' },
9
10                    { "date": "3", "value": 31.75, "type": "应收金额", "rate": '2016-04-01' },
11                    { "date": "3", "value": 35.44, "type": "已收金额", "rate": '2016-06-04' },
12
13                    { "date": "4", "value": 36.75, "type": "应收金额", "rate": '2016-05-01' },
14                    { "date": "4", "value": 65.44, "type": "已收金额", "rate": '2016-06-05' },
15   
16                    { "date": "5", "value": 35.75, "type": "应收金额", "rate": '2016-06-01' },
17                    { "date": "5", "value": 15.44, "type": "已收金额", "rate": '2016-06-06' },
18                ];
19
20                //var ds = new DataSet();
21                //var dv = ds.createView().source(data);          
22                var chart = new G2.Chart({
23                    container: 'mountNode',
24                    forceFit: true,
25                    height: 400
26                });
27                chart.source(data);//json dv 
28                chart.tooltip({
29                    showTitle: false,
30                    itemTpl: '<li><span style="background-color:{color};" class="g2-tooltip-marker"></span>{name}: {value}</li>'//定义标头
31                });
32
33                chart.line().position('date*value').color('type', ['red', 'baclk']).tooltip('rate*value*type', function (rate, value, type) {
34                    rate = rate + type;//算法
35                    return {
36                        name: rate,//itemTpl:{name}
37                        value: value// itemTpl:{value}
38                    }
39                });
40                chart.point().position('date*value').color('type').size(4).shape('circle').style({
41                    stroke: '#fff',
42                    lineWidth: 1
43                });
44                chart.render();

　　实例图