2017-11-08 10 views
0

서버에서 직사각형이나 마름모꼴 또는 원 또는 사다리꼴 또는 다각형 좌표를 받을지 확실하지 않은 경우 Angular 프레임 워크에서 캔버스에 개체를 그리려면 어떤 그림을 선택해야합니까?html5 캔버스에 관하여

답변

2

혼동을 피하기 위해 다음과 같은 작업을 수행 할 수 있습니다.

  • 각 다이어그램에는 특정 좌표 세트가 있습니다. r 처럼 외각은 4, 정사각형은 4, 원은 무한 점 (그려지는 중심과 반지름이 있음)이 있습니다.
  • 좌표를 가져 오는 다이어그램에 대한 자바 스크립트를 체크하고 이에 따라 서버 응답에서 좌표를 가져올 수 있습니다.
  • 다이어그램 유형의 추가 속성을 서버 응답에 넣고 자바 스크립트로 필터링 할 수 있습니다.
  • 당신이 서버에서 다이어그램 유형을 전송하고 당신이

스위치 문을 사용하거나 조건이 다이어그램 유형을 확인하는 경우, 당신이받을 경우, 그에 따라 서버 응답의 결과를 가져 오는 것은 어렵지 않을 것이다 그러면 json의 응답이 좋아질 것입니다.

if(response.data.diagram_type === "square"){ 
    // now you will know what attributes you need for this shape 
    // assuming that you have sent coordinates in an array from server and each array has (x, y) so create objects {} not arrays []. 
    var coordinate_0 = {}; 
    var coordinate_1 = {}; 
    var coordinate_2 = {}; 
    var coordinate_3 = {}; 
    coordinate_0 = data.response.coordinates[0]; 
    coordinate_1 = data.response.coordinates[1]; 
    coordinate_2 = data.response.coordinates[2]; 
    coordinate_3 = data.response.coordinates[3]; 
}else if (response.data.diagram_type === "circle"){ 
    var coordinate_center = {}; 
    coordinate_center = data.response.circle_center; 
    var radius= data.response.circle_radius; 
    // create your shape accordingly. 
} 
// similarly for other diagram. 

// hope it helps.