Blame view

components/mpvue-echarts/src/wx-canvas.js 1.65 KB
4b045f7c   刘淇   江阴初始化项目
1
2
3
4
5
6
7
8
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
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
  export default class WxCanvas {
    constructor(ctx, canvasId) {
      this.ctx = ctx;
      this.canvasId = canvasId;
      this.chart = null;
  
      WxCanvas.initStyle(ctx);
      this.initEvent();
    }
  
    getContext(contextType) {
      return contextType === '2d' ? this.ctx : null;
    }
  
    setChart(chart) {
      this.chart = chart;
    }
  
    attachEvent() {
      // noop
    }
  
    detachEvent() {
      // noop
    }
  
    static initStyle(ctx) {
      const styles = ['fillStyle', 'strokeStyle', 'globalAlpha',
        'textAlign', 'textBaseAlign', 'shadow', 'lineWidth',
        'lineCap', 'lineJoin', 'lineDash', 'miterLimit', 'fontSize'];
  
      styles.forEach((style) => {
        Object.defineProperty(ctx, style, {
          set: (value) => {
            if ((style !== 'fillStyle' && style !== 'strokeStyle')
              || (value !== 'none' && value !== null)
            ) {
              ctx[`set${style.charAt(0).toUpperCase()}${style.slice(1)}`](value);
            }
          },
        });
      });
  
      ctx.createRadialGradient = () => ctx.createCircularGradient(arguments);
    }
  
    initEvent() {
      this.event = {};
      const eventNames = [{
        wxName: 'touchStart',
        ecName: 'mousedown',
      }, {
        wxName: 'touchMove',
        ecName: 'mousemove',
      }, {
        wxName: 'touchEnd',
        ecName: 'mouseup',
      }, {
        wxName: 'touchEnd',
        ecName: 'click',
      }];
  
      eventNames.forEach((name) => {
        this.event[name.wxName] = (e) => {
          const touch = e.mp.touches[0];
          this.chart._zr.handler.dispatch(name.ecName, {
            zrX: name.wxName === 'tap' ? touch.clientX : touch.x,
            zrY: name.wxName === 'tap' ? touch.clientY : touch.y,
          });
        };
      });
    }
  }