2013-08-30 3 views
3

내 프로젝트에서 fabric 플러그인을 사용하고 있습니다. 객체가 선택되면 다음과 같은 디자인으로 선택된 영역을 얻습니다. 수 아래 그림과 같이 좀 그림으로 선택한 영역에 이미지를 첨부 : - 내가 사용하여 텍스트를 설정 fabric.js에서 객체의 선택 스타일을 변경하십시오.

, 현재

hw[i] = new fabric.Text($(this).val(), { 
       left : 100, 
       top : 100, 
       fontSize : 20 
      }); 

, 나는 점점 오전 :

enter image description here

과 내가하고자 얻으십시오,

enter image description here

GitHub의 사이트 : https://github.com/pixolith/fabricjs-customise-controls-extension

라이브 데모가 : http://pixolith.github.io/fabricjs-customise-controls-extension/example/index.html)

이 당신을 허용 할 것이다 당신이 직물 JS와 직접 그렇게 할 수는 없지만개 감사합니다,

+0

만 코너 색상, 모퉁이의 크기, 투명을 사용자 정의 할 수있는 작업이

fabric.Canvas.prototype.customiseControls({ tl: { action: 'remove', }, tr: { action: 'rotate' }, br: { action: 'scaleY', }, }); 

다음과 아이콘을 변경 얻을 국경과 거스름돈에 대한 선택과 같은, 이것이 가능하다면 확실하지 않다. –

+0

@PrasannaAarthi 나는 textShadow를 시도하고있다 : 'rgba (0,0,0,0.3) 5px 5px 5px' 여섯 즉 즉 마지막 값을 흐리게 ?? – anam

+0

rgba 시도 (0,0,0.3) 0 0 5px .. –

답변

-1

는, 누군가가 그것을 위해 확장했다 핸들 이미지와 해당 동작을 변경하십시오.

확장을 추가 한 후이 같은 것을 추가 할 수 있습니다

fabric.Object.prototype.customiseCornerIcons({ 
    settings: { 
     borderColor: 'black', 
     cornerSize: 25, 
     cornerShape: 'circle', 
     cornerBackgroundColor: 'black', 
     cornerPadding: 10 
    }, 
    tl: { 
     icon: 'icon/trashcan.svg' 
    }, 
    tr: { 
     icon: 'icon/rotate.svg' 
    }, 
    br: { 
     icon: 'icon/scale.svg' 
    }, 
}); 
관련 문제