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) 명령어
[공지] 기술 게시판
일
월
화
수
목
금
토
2.1
2.2
2.3
2.4
2.5
2.6
2.7
2.8
2.9
2.10
2.11
2.12
2.13
2.14
2.15
2.16
2.17
2.18
2.19
2.20
2.21
2.22
2.23
2.24
2.25
2.26
2.27
2.28
tag