Javascript34 preventDefaultAlign 문서에도 없는 config container에 floating속성을 사용해서 화면에서 정렬 시켜줘야 하는 기능이 있었다. alignTo 함수나 showBy 함수를 이용해서 정렬하는데 정렬이 됐다가 화면의 중앙으로 이동하는 것이다. (디버깅 해보니) 참고로 alignTo 함수는 컴포넌트가 visible 상태여야만 한다. 직감적으로 defaultAlign 문제겠구나 하고 수정했는데 offset관련 config이나 메쏘드가 없어서 문제 였다. 내가 원하는 건 defaultAlign을 사용 안하는건데... config도 존재 하지 않아서... ExtJS 내부 소스를 뒤적뒤적 하다보니 내가 원하는 관련 config를 찾았다! 문서에는 명시되어 있지 않다. 속성명은 preventDefaultAlign이다. 해당 속.. 2019. 5. 2. 요소 추가하기 d3 insert 잘 사용하자 d3에서 특정 요소 하위에 다른 요소를 집어 넣는 방법은 크게 2가지가 있다. append & insert dom의 appendChild와 insertBefore와 같은 동작이다. append는 맨 뒤에 넣고, insert는 앞에 넣고! 단, 오늘 insert를 처음 사용하면서 실수한 건 insert는 2개의 인자를 받는데 type, tag 이름이 들어간다. before, 뒤에 올 특정 선택자(css 선택자 사용) 여기에서 before 부분을 이해를 잘못해서 삽질을 했다. 문서를 잘 읽어야지... CSS 선택자를 사용해야 한다! 2019. 4. 19. 사용자 정의 Bind Custom bind config ExtJS에서 제공해주는 bind config이 아닌 사용자 정의 bind config을 만들고 싶을 때가 있다. 어떻게 해야할까? 사용법 config: { foo: null, // null 이외의 값으로 초기화 시 update 이벤트 발생 }, twoWayBindable: ['foo'], 먼저 config를 추가 해주고 twoWayBindable에 해당 값을 설정 해준다. (twoWayBindable 관련 사항은 문서 참조) updateFoo() { // Do something } 이렇게 설정해주면 간단하게 된다. ViewModel이나 setFoo를 이용해서 값을 설정하면 updateFoo 함수가 실행된다. 2019. 4. 16. Publish Custom ViewModel 데이터 ExtJs에서는 사용자에게 기본적인 viewModel 데이터를 제공해준다. 예를 들면, Text 컴포넌트는 기본적으로 rawValue, value, dirty 값을 제공한다. 해당 값들은 viewModel 및 reference를 이용해서 사용할 수 있다. 하지만 다른 값들을 나의 입맛에 맞게 사용하고 싶을 때가 있다. 그 때 사용 할 수 있는게 publishes란 config과 publishState라는 함수다. 사용법 Text 컴포넌트에 값이 유효한지 체크하는 config를 추가해서 사용하고 싶다면, publishes: {'value', 'rawValue', 'dirty', 'valid'} valid라는 값을.. 2019. 4. 13. 좌표 시스템 좌표계 d3에서 svg 엘레먼트들을 드래깅해서 위치 값을 변경해주는 경우가 생긴다. 이 때 2가지의 방법이 있다. 각 엘레먼트들을 독립적으로 좌표값을 변경시키는 방법 각 엘레먼트들을 group으로 묶고 group을 transform의 translate를 이용해서 변경시키는 방법 나는 2번을 이용해서 구현했는데, 이렇게 되면 메인 svg에 pan & zoom 기능이 있을 경우에 좌표 시스템이 변환이 된다. pan 또는 zoom을 사용할 경우 transform을 이용해서 좌표계를 변환 시키기 때문에 하위에서 좌표 값을 변경하는 경우 이상한 위치로 이동 되는 현상을 볼 수 있다. 이 때에는 pan 또는 zoom 된 값 만큼 좌표 값을 변환 시켜줘야 정상적인 위치로 이동한다. 2019. 4. 5. 브라우저에게 이벤트란? 브라우저가 이벤트를 감지하는 방법은 2가지로 나눌 수 있습니다. 이벤트 버블링(Event Bubbling) 어떤 특정 요소에서 이벤트가 발생했을 경우 상위 요소로 이벤트를 전파하는 방식(단, 상위 요소가 같은 이벤트 핸들러를 가지고 있다는 가정) 이벤트 캡처링 위의 이벤트 버블링과 반대되는 방식으로 어떤 특정 요소에서 이벤트가 발생했을 경우 최상위 요소(body)부터 해당 요소로 내려가는 방식 위의 2가지 방식으로 이벤트가 발생하기 때문에 개발자는 원리를 숙지하고 있어야 예상치 못한 동작이 발생했을 경우 추론하여 해결 할 수 있습니다. 그럼 기본 동작을 개발자가 조작 하기 위해서는 어떻게 해야 할까요? 이벤트 조작 방법 3가지 event.preventDefault() 현재 이벤트의 기본 동작을 중단(예:.. 2019. 3. 13. 이전 1 2 3 4 5 6 다음
