K

window.close() 로 창이 안닫히는건 크롬도 마찬가진 것 같다. 근데 크롬은 아래 코드로 해결된다고 하는데 파이어폭스에서는 여전히 창이 닫히지 않는다..;; window.open('','_self').close(); 크롬은 창 내용을 빈칸으로 두면 공백 페이지가 생성되는 것 같다. 파이어폭스는 안되나보다.. 아래 코드로 해결 window.open('about:blank','_self').close(); 근데 창이 아예 닫히지는 않고 창 내용이 about:blank로 바뀐다. 그래도 원래 창은 사라지니 된건가?..

https://baegofda.tistory.com/179

현재 개발 중인 웹 페이지에서 요소의 좌표를 구해야 하는 일이 생겼다. 현재 구성은 아래 사진과 같이 전체가 svg가 아니라 일부분만 svg다. (왼쪽의 지도 부분) svg는 지도와 그 위에 좌표에 따라 마커를 표시하고 있다. 좌표가 그대로면 좋겠지만.. 지도와 마커는 transform을 이용해서 위치가 변해있는 상태다. 현재 상태에서 뷰박스의 0,0은 왼쪽 위, 지도의 0,0은 왼쪽 아래인 상황.. 마커의 좌표를 알고있지만, 그 좌표를 뷰박스에 적용할 때는 다른 위치가 나오는 것이다. 특정 좌표에 transform을 적용한 후의 좌표를 알고싶었다. 이게 머리로는 이해하고 있는데 말로 설명하기가 잘..;; 암튼 마커의 현재 좌표를 알고 싶은 것.. 내가 알고 있는 좌표에 transform을 적용하면 나오..

Javascript를 이용하여 html에 svg 요소를 추가하였다. F12를 이용하여 요소를 확인했을 때, 요소에는 원하는 대로 추가되었지만 화면에 나타나지 않는 현상이 발생했다. createElement를 이용해서 요소를 추가했는데, createElementNS로 바꾼 후 해결되었다. createElementNS는 지정된 네임스페이스 URL과 적합한 이름으로 element를 만든다. SVG는 XHTML 언어이므로 동적으로 생성할때는 createElement를 사용하면 안되고 createElementNS를 사용해야 한다. 네임스페이스 URL를 지정하지 않고 element를 만들 때는 createElement 메소드를 사용한다. createElement를 이용해서 동적 삽입할 경우, 개발자 도구의 태그에는..

window.onload = function () { var httpRequest; /* button이 클릭되었을때 이벤트 */ document.getElementById("ajaxCall").addEventListener("click", () => { /* textBox에 작성된 name 데이터를 가져옴 */ var inputName = document.getElementById("inputName").value; /* 통신에 사용 될 XMLHttpRequest 객체 정의 */ httpRequest = new XMLHttpRequest(); /* Get 방식으로 name 파라미터와 함께 요청 */ let url = "http://127.0.0.1:9000/data/" + inputName; consol..

대상의 경로 뒤에 --disable-web-security --disable-gpu --user-data-dir=~/tmp 추가 "C:\Program Files\Google\Chrome\Application\chrome.exe" --disable-web-security --disable-gpu --user-data-dir=~/tmp 관리자 권한으로 실행 관리자 권한으로 실행하기 싫다면? --user-data-dir=~/tmp 제거 https://i5i5.tistory.com/935

const drag = () => { const svg = document.querySelector('svg'); let isDragging = false; let startClientX, startClientY; let startViewBoxX, startViewBoxY; let viewport_width, viewport_height; let newX, newY; let initialScale; svg.addEventListener('mousedown', (e) => { let [x, y, width, height] = svg.getAttribute('viewBox').split(' ').map(Number); isDragging = true; startClientX = e.clientX; start..

marker.js var markerPositions = [[126.8517037,-37.5324785,"TwoWheeler"], [126.8554410,-37.5378600,"Pedestrian"], [126.8538170,-37.5338370,"Vehicle"]]; var svgNS = "http://www.w3.org/2000/svg"; var xlinkNS = "http://www.w3.org/1999/xlink"; for (var i=0; i

const zoom = () => { const svg = document.querySelector('svg'); // zooming svg.onwheel = function (event) { event.preventDefault(); // set the scaling factor (and make sure it's at least 10%) let scale = event.deltaY / 1000; scale = Math.abs(scale) < .1 ? .1 * event.deltaY / Math.abs(event.deltaY) : scale; // get point in SVG space let pt = new DOMPoint(event.clientX, event.clientY); pt = pt.mat..

window.addEventListener("DOMContentLoaded", (event) => { const svg = document.querySelector('svg'); // zooming svg.onwheel = function (event) { event.preventDefault(); // set the scaling factor (and make sure it's at least 10%) let scale = event.deltaY / 1000; scale = Math.abs(scale) < .1 ? .1 * event.deltaY / Math.abs(event.deltaY) : scale; // get point in SVG space let pt = new DOMPoint(event...