logo image
메인
기술
HOME
기술

canvas의 width와 height 의 setter를 wrap 처리 하는 방법

목록
#getownpropertydescriptor
    wrapMethods(){
        let descWidth = Object.getOwnPropertyDescriptor(HTMLCanvasElement.prototype,'width')
        let newDescWidth = {
            configurable: descWidth.configurable, enumerable: descWidth.enumerable,
            get:descWidth.get,
            set:(v)=>{ descWidth.set.apply(this,[v]); this.flush(); },
        }
        Object.defineProperty(this,'width',newDescWidth)
        let descHeight = Object.getOwnPropertyDescriptor(HTMLCanvasElement.prototype,'height')
        let newDescHeight = {
            configurable: descHeight.configurable, enumerable: descHeight.enumerable,
            get:descHeight.get,
            set:(v)=>{ descHeight.set.apply(this,[v]); this.flush(); },
        }
        Object.defineProperty(this,'height',newDescHeight)
       
    }


그냥 setter, getter 에 선언해도 되긴 된다.
성능 이슈가 있을 것 같지만...

    get width(){      
        const desc = Object.getOwnPropertyDescriptor(Object.getPrototypeOf(this.constructor).prototype,'width');
        return desc.get.apply(this);
    }
    /**
     * @param {number} v
     */
    set width(v){
        const desc = Object.getOwnPropertyDescriptor(Object.getPrototypeOf(this.constructor).prototype,'width');
        desc.set.apply(this,[v]);
        this.flush();
    }

    get height(){      
        const desc = Object.getOwnPropertyDescriptor(Object.getPrototypeOf(this.constructor).prototype,'height');
        return desc.get.apply(this);
    }
    /**
     * @param {number} v
     */
    set height(v){
        const desc = Object.getOwnPropertyDescriptor(Object.getPrototypeOf(this.constructor).prototype,'height');
        desc.set.apply(this,[v]);
        this.flush();
    }



목록
댓글
  • / /
  • No Nickname
    No Comment
  • 권한이 없습니다.
    {{m_row.m_nick}}
    -
목록형 📷 갤러리형
제목
[기본형] HTML (with 부트스트랩5.3 , jquery 3.7, vue.js)
유용한 리눅스(LINUX) 명령어
[공지] 기술 게시판
일
월
화
수
목
금
토
6.1
css grid repeat 사용법. (동적 컬럼)
6.2
6.3
6.4
6.5
6.6
6.7
6.8
6.9
6.10
6.11
6.12
6.13
6.14
6.15
6.16
6.17
6.18
6.19
6.20
6.21
6.22
6.23
6.24
6.25
6.26
6.27
6.28
6.29
6.30
7.1
7.2
7.3
7.4
7.5
tag