CoreChain

* 작성 방법
 cc.exec.Canvas('idOne');

 cc.exec.Canvas('idOne', 300, 200);

Options
elementAttr {Boolean}
<canvas> 엘리먼트에 설정할 글로벌 속성
height {Number\|String}
캔버스 높이, 디폴트 150px
showTo {HTMLElement}
<canvas>엘리먼트의 패어런트 엘리먼트
width {Number/String}
캔버스 너비, 디폴트 300px
x {Number}
캔버스가 표시될 x 좌표, 디폴트: 10
y {Number}
캔버스가 표시될 y 좌표, 디폴트: 10

Method
setOptions (HTMLElement/String, Number/String, Number/String, HTMLElement/String) setOptions(el, width, height, showTo, attr) cc.exec.Canvas()를 실행할 때 파라미터에 지정한 값을 설정한다. Parameters : • {HTMLElement\|String} el, 캔버스 엘리먼트 • {Number\|String} width, 캔버스 너비, 디폴트 300px • {Number\|String} height, 캔버스 높이, 디폴트 150px • {HTMLElement\|String} showTo, 캔버스 엘리먼트의 패어런트 엘리먼트 • {Hash} attr, <canvas>에 설정할 엘리먼트 속성 Returns : • 없음
cc.exec.Canvas()를 실행할 때 파라미터에 지정한 값을 설정한다.
setCanvasAttr () setCanvasAttr() 클래스를 생성할 때 지정한 options를 this 오브젝트에 설정한다. Parameters : • 없음 Returns : • 없음
클래스를 생성할 때 지정한 options를 this 오브젝트에 설정한다.
createContext () createContext() 캔버스 콘텍스트 오브젝트를 생성한다. Parameters : • 없음 Returns : • 없음
캔버스 콘텍스트 오브젝트를 생성한다.
getContext () : Object getContext() this.context를 반환한다. Parameters : • 없음 Returns : • {Object} e, 콘텍스트 오브젝트
this.context를 반환한다.
clearCanvas (String) clearCanvas(style) 그려진 캔버스를 지운다. 메소드입니다. Parameters : • {String} style, (option) fill/stroke Style Returns : • 없음
그려진 캔버스를 지운다.
clearShadow () clearShadow() Shadow 초기 값을 설정한다. Parameters : • 없음 Returns : • 없음
Shadow 초기 값을 설정한다.
setShadow (float, float, float, float) setShadow(offsetX, offsetY, blur, color) Shadow 값을 설정한다. Parameters : • {Float} offsetX, shadowOffsetX, 디폴트: 0 • {Float} offsetY, shadowOffsetY, 디폴트: 0 • {Float} blur, shadowBlur, 디폴트: 0 • {Float} color, shadowColor, 디폴트: white Returns : • 없음
Shadow 값을 설정한다.
setTitle (Object) setTitle(that) 그래프 타이틀 오브젝트를 생성하고 타이틀을 설정한다. Parameters : • {Object} that, 메소드를 호출한 클래스 오브젝트 Returns : • 없음
그래프 타이틀 오브젝트를 생성하고 타이틀을 설정한다.
strokeStyle (String) strokeStyle(style) strokeStyle 값을 설정한다. Parameters : • {String} style, 콘텍스트에 설정할 style Returns : • 없음
strokeStyle 값을 설정한다.
fillStyle (String) fillStyle(style) fillStyle 값을 설정한다. Parameters : • {String} style, 콘텍스트에 설정한할 style Returns : • 없음
fillStyle 값을 설정한다.
font (String) font(value) font를 설정한다. Parameters : • {String} value, font 값 Returns : • 없음
font를 설정한다.
setFontStyle (String, String, String) setFontStyle(font, style, fillStyle) font와 style을 설정한다. Parameters : • {String} font, font • {String} style, Style • {String} fillStyle, fill/style 구분. f: fill, s: style Returns : • 없음
font와 style을 설정한다.
textAlign (String) textAlign(align) 텍스트 좌우 정렬 값을 설정한다. Parameters : • {String} align, textBaseline 값 start(디폴트), end, left, right, center Returns : • 없음
텍스트 좌우 정렬 값을 설정한다.
textBaseline (String) textBaseline(base) 텍스트 기준선 정렬 값을 설정한다. Parameters : • {String} base, textBaseline 값 top, hanging, middle, alphabetic(디폴트), ideographic, bottom Returns : • 없음
텍스트 기준선 정렬 값을 설정한다.
fillText (String, String, String, String) fillText(text, x, y, max) fillText()를 실행한다. Parameters : • {String} text, 표시할 텍스트 • {String} x, x 좌표, 디폴트: this.x • {String} y, y 좌표, 디폴트: this.y • {String} maxWidth, 텍스트를 표현할 최대 너비, 생략 가능 Returns : • 없음
fillText()를 실행한다.
strokeText (String, String, String, String) strokeText(text, x, y, max) strokeText()를 실행한다. Parameters : • {String} text, 표시할 텍스트 • {String} x, x 좌표, 디폴트: this.x • {String} y, y 좌표, 디폴트: this.y • {String} maxWidth, 텍스트를 표현할 최대 너비, 생략 가능 Returns : • {Boolean} true: 표시 상태, false: hidden 상태
strokeText()를 실행한다.
ieMargin () : Hash ieMargin() IE 브라우저에서 실행한 경우 margin과 padding 값을 반환한다. Parameters : • 없음 Returns : • rt.mar : margin • rt.pad : padding
IE 브라우저에서 실행한 경우 margin과 padding 값을 반환한다.
setText (String) setText(text) 지정한 위치에 텍스트를 설정한다. Parameters : • {String} text, 표시할 텍스트 Returns : • 없음
지정한 위치에 텍스트를 설정한다.
rotateText (String, Float, Float, Float, String) rotateText(text, x, y, rotate, fs) 텍스트를 rotate한다. Parameters : • {String} text, 텍스트 • {Float} x, x축 좌표 • {Float} y, y축 좌표 • {Float} rotate, 회전 각도 • {String} fillStroke, fill/stroke 구분 f: fillText, s: strokeText, 디폴트: fill Returns : • 없음
텍스트를 rotate한다.
globalAlpha (Float) globalAlpha(alpha) globalAlpha 값을 설정한다. Parameters : • {Float} alpha, 콘텍스트에 설정할 globalAlpha Returns : • 없음
globalAlpha 값을 설정한다.
lineWidth (Float) lineWidth(lineWidth) 라인 폭 값을 지정한다. Parameters : • {Float} lineWidth, lineWidth 값 Returns : • 없음
라인 폭 값을 지정한다. 0도 값이므로 처리한다
strokeLineWS (Float, String) strokeLineWS(lw, ss) line width를 설정하고 stroke 스타일을 설정한다. Parameters : • {Float} lineWidth, line Width 값 • {String} strokeStyle, stroke style Returns : • 없음
line width를 설정하고 stroke 스타일을 설정한다.
fillLineWS (Float, String) fillLineWS(lw, fs) line width를 설정하고 fill 스타일을 설정한다. Parameters : • {Float} lineWidth, line Width 값 • {String} fillStyle, fill style Returns : • 없음
line width를 설정하고 fill 스타일을 설정한다.
drawLine (String, String, Array, Boolean, String) drawLine() 선을 긋는다. Parameters : • {String} xs, 시작 x 좌표 • {String} ys, 시작 y 좌표 • {Array} lineTo, 종료 x, y 좌표, lineTo • {Boolean} 서브패스, closePath() 실행 여부 true: 실행, false: 실행하지 않음 • {String} style, strokeStye 스타일 예: drawLine(10, 10, [[10, 80], [80, 80]], true, 'red') Returns : • 없음
선을 긋는다.
getRadian (Number) : Number getRadian(degree) 라디안 값을 구해 반환한다. Parameters : • {Number} degree, 도(ex: 30, 90) Returns : • {Number} 라디안 값
라디안 값을 구해 반환한다.
textFillRect (Number, Number, Number, Number) textFillRect(x, y, wd, ht) 차트가 아닌 텍스트 fillRect 처리를 행한다. Parameters : • {Number} x, x 좌표 • {Number} y, y 좌표 • {Number} wd, 너비 • {Number} ht, 높이 Returns : • 없음
차트가 아닌 텍스트 fillRect 처리를 행한다.
textArc (Number, Number, Number, Number, String) textArc(x, y, rd, st, en, dir) 차트가 아닌 텍스트 arc 처리를 행한다. Parameters : • {Number} x, x 좌표 • {Number} y, y 좌표 • {Number} rd, 반지름 • {Number} st, 시작 각도 • {Number} en, 종료 각도 • {String} dir, 그리는 방향 Returns : • 없음
차트가 아닌 텍스트 arc 처리를 행한다.
circle (String, Float, Float, String, String, String) circle(sf, x, y, radius, style, linew) 호(arc) 형태가 아닌 원(circle)을 그린다. Parameters : • {String} sf, stroke/fill 구분; 디폴트: fill • {float} x, x 좌표 • {float} y, y 좌표 • {String} radius, 반지름 • {String} style, 스타일(선색) • {String} linew, line width Returns : • 없음
호(arc) 형태가 아닌 원(circle)을 그린다.
fillArc (Float, Float, String, String, String, String, String) fillArc(x, y, radius, start, end, dir, style) 채운 원을 그린다. Parameters : • {float} x, x 좌표 • {float} y, y 좌표 • {String} radius, 반지름 • {String} start, 시작 각도, 디폴트: 0 • {String} end, 종료 각도, 디폴트: Math.PI * 2 • {String} dir,그리는 방향, 디폴트: false(시계도는 방향) • {String} style, 스타일(선색) Returns : • 없음
채운 원을 그린다.
strokeArc (Float, Float, String, String, String, String, String) strokeArc(x, y, radius, start, end, dir, style) 빈 원을 그린다. Parameters : • {String} x, x 좌표 • {String} y, y 좌표 • {String} radius, 반지름 • {String} start, 시작 각도, 디폴트: 0 • {String} end, 종료 각도, 디폴트: Math.PI * 2 • {String} dir,그리는 방향, 디폴트: false(시계도는 방향) • {String} style, 스타일(선색) Returns : • 없음
빈 원을 그린다.
linear (String, String, String, String, Array, Array) linear(xs, ys, xe, ye, color, rec) Linear Gradient를 표현한다. Parameters : • {String} xs, x 시작 좌표 • {String} ys, y 시작 좌표 • {String} xe, x 끝 좌표 • {String} ye, y 끝 좌표 • {Array} offsetColor, [offset, color] 형태로 지정, 다수 지정 가능 예: [[0, '#ff00ff'], [0.6, '#00ffff'], [1, '#000077']] • {Array} fillrect, [x, y, width, height] 사각형 기준 예: [10, 10, 100, 100] Returns : • 없음
Linear Gradient를 표현한다.
drawImage (Image/Canvas/Video, Float, Float, Float, Float, Float, Float, Float, Float) drawImage(image, p1, p2, p3, p4, p5, p6, p7, p8) 캔버스에 이미지, 캔버스(Canvas), 비디오(Video)를 삽입한다. Parameters : * 파라메타 3개 일때 • {Image\|Canvas\|Video} image, 이미지 데이타 • {float} p1, 캔버스 x 좌표 • {float} p2, 캔버스 y 좌표 * 파라메타 5개 일때 • {Image\|Canvas\|Video} image, 이미지 데이타 • {float} p1, 캔버스 x 좌표 • {float} p2, 캔버스 y 좌표 • {float} p3, 표현할 이미지 너비 • {float} p4, 표현할 이미지 높이 * 파라메타 9개 일때 • {float} p1, 시작 x 좌표 • {float} p2, 시작 y 좌표 • {float} p3, 잘라낼 너비 • {float} p4, 잘라낼 높이 • {float} p5, 표현할 x 좌표 • {float} p6, 표현할 y 좌표 • {float} p7, 표현할 이미지 너비 • {float} p8, 표현할 이미지 높이 Returns : • 없음
캔버스에 이미지, 캔버스(Canvas), 비디오(Video)를 삽입한다.

CoreChain

Canvas

개요