PerfectVector
작성: Irene Kim5분 읽기

QGIS SVG 마커: 색상 편집 가능한 심볼 준비하기

채우기·외곽선 매개변수, 실제 구멍과 고정 강조색을 가진 QGIS SVG 마커를 준비하세요. 일반 SVG 원본을 유지하고 대상용 사본을 검사합니다.

목차

색상을 편집할 수 있는 사용자 지정 QGIS SVG 마커를 준비하려면 앱에서 제어할 페인트 속성에 QGIS의 param() 자리표시자를 추가하세요. 고정할 영역은 명시적 색상을 유지하세요. QGIS 3.44 심볼 선택기 매뉴얼은 채우기, 외곽선, 각각의 불투명도와 외곽선 너비의 자리표시자를 설명합니다.

작고 깔끔한 심볼로 시작하세요. 일러스트 크기에서는 좋아 보이는 아이콘도 지도 마커로 쓰면 구멍, 강조 부분이나 외곽선이 사라질 수 있습니다.

이 가이드의 범위: 일반 SVG 원본을 브라우저에서 렌더링하고 매개변수 사본의 XML을 검사했습니다. 사본을 QGIS에 가져오지는 않았습니다. 아래 매개변수 문법은 3.44 문서를 따릅니다. 대상 검사는 사용자나 GIS 수신자가 앱에서 완료해야 합니다.

일반 원본과 QGIS 사본 유지하기

도형이 같은 두 파일을 사용하세요.

파일목적
marker-master.svg편집과 브라우저 검사용 일반 SVG 페인트
marker-qgis.svg선택한 속성에 QGIS 매개변수 자리표시자를 넣은 대상용 사본

이렇게 나누면 원본 그림을 확인하기 쉽습니다. 일반 원본의 브라우저 미리보기는 그 소스가 브라우저에서 어떻게 렌더링되는지 보여 줍니다. QGIS 사본을 올바르게 가져왔거나 제어가 의도대로 동작한다는 증거는 아닙니다.

직접 만든 마커는 녹색 본체, 투명한 원형 구멍과 금색 마름모 강조 부분이 있습니다. 경로 두 개를 포함하며 삽입 래스터 이미지는 없습니다.

직접 만든 원본 그림
투명한 구멍과 고정 금색 강조 부분이 있는 일반 녹색 핀 SVG의 브라우저 렌더링 및 24, 32, 48픽셀 미리보기
일반 SVG 원본을 브라우저에서 렌더링했습니다. 구멍으로 체커보드가 보입니다. QGIS 가져오기나 색상 매개변수 테스트는 아닙니다.

원본에 실제 구멍 만들기

다음을 marker-master.svg로 저장하세요.

<svg xmlns="http://www.w3.org/2000/svg"
     width="64" height="64" viewBox="0 0 64 64">
  <path id="body" fill="#237466" fill-opacity="1"
        stroke="#173f37" stroke-opacity="1" stroke-width="2"
        fill-rule="evenodd"
        d="M32 5C19 5 10 14 10 27C10 42 32 59 32 59S54 42 54 27C54 14 45 5 32 5Z M32 17A10 10 0 1 0 32 37A10 10 0 1 0 32 17Z"/>
  <path id="accent" fill="#f2c96c" stroke="none"
        d="M32 41L36 46L32 51L28 46Z"/>
</svg>

본체 경로는 바깥 윤곽선과 안쪽 원형 윤곽선을 포함합니다. 이 구성에서는 fill-rule="evenodd"가 안쪽 영역을 구멍으로 만듭니다. 흰 원판을 칠하는 대신 마커를 통해 배경이 보입니다. MDN fill-rule 참고 문서는 규칙이 채워질 영역을 결정하는 방식을 설명합니다.

viewBox는 원본 좌표 사각형을 정의합니다. 여기서는 외곽선 주변 공간이 있는 64단위 정사각형입니다. 두 사본의 프레임을 일관되게 유지하세요. 프레임 안에서 심볼이 예상보다 작으면 표시 크기를 늘리기 전에 도형과 여백을 확인하세요.

금색 강조 부분은 별도 경로이므로 페인트 선택이 명확합니다. 더 복잡한 아이콘에서는 매개변수를 추가하기 전에 공유 본체 색상에 속할 영역을 정하세요. SVG 색상 가이드는 채우기와 스트로크가 저장되는 위치를 설명합니다.

본체에 매개변수를 넣고 강조색은 고정하기

marker-qgis.svg라는 사본을 만드세요. id="body"인 경로에서 페인트 속성 다섯 개를 다음 속성 블록으로 교체하세요.

fill="param(fill) #237466"
fill-opacity="param(fill-opacity) 1"
stroke="param(outline) #173f37"
stroke-opacity="param(outline-opacity) 1"
stroke-width="param(outline-width) 2"

경로 데이터와 fill-rule은 유지하세요. accent 경로의 fill="#f2c96c"와 stroke="none"도 그대로 두세요.

SVG 속성QGIS 자리표시자의도한 제어
fillparam(fill)본체 채우기 색상
fill-opacityparam(fill-opacity)본체 채우기 불투명도
strokeparam(outline)본체 외곽선 색상
stroke-opacityparam(outline-opacity)본체 외곽선 불투명도
stroke-widthparam(outline-width)본체 외곽선 너비

자리표시자 뒤 값은 QGIS 문법의 선택적 기본값입니다. 일반 SVG 뷰어가 매개변수 페인트 값을 이해한다는 보장은 아닙니다. 일반 SVG 편집과 미리보기에는 일반 원본을 사용하세요.

모든 색상을 자동으로 param(fill)로 바꾸지 마세요. 이 디자인에서는 금색 강조 부분을 별도로 유지하기로 한 결정을 없애게 됩니다. 같은 제어에 반응해야 할 영역에만 공유 자리표시자를 적용하세요.

전달 전에 대상용 사본 검사하기

XML 검사에서 두 파일의 viewBox와 경로 데이터가 같음을 확인했습니다. QGIS 사본의 body에는 의도한 다섯 자리표시자가 있으며 accent는 고정 금색 채우기를 유지합니다. 이 예제에는 <image> 요소, 외부 파일이나 글꼴이 없습니다.

자신의 마커는 다음을 확인하세요.

  • 원본에 예상한 벡터 도형이 있는지 확인하세요. 페인트 속성을 바꿔도 삽입 이미지 내부 픽셀을 별도 영역으로 재색칠할 수는 없습니다.
  • 의도한 경로만 매개변수를 받도록 하세요. 장식 강조색은 명시적으로 유지하세요.
  • 파일 다른 곳의 스타일 선언에 충돌하는 고정 페인트 값이 남지 않도록 하세요.
  • 대비되는 배경에서 구멍이 실제 빈 공간으로 유지되는지 확인하세요.
  • 외곽선 공간은 충분하되 빈 프레임이 너무 크지 않은지 확인하세요.

XML 파싱 성공은 문법을 검사합니다. 대상 렌더러의 모든 SVG 기능 지원을 인증하지는 않습니다. 원본을 단순하게 유지하고 다음 앱 검사를 완료하세요.

수신자의 QGIS 프로젝트에서 마커 확인하기

점 심볼 선택기에서 SVG marker 심볼 레이어를 선택하고 대상용 사본을 불러오세요. 위에서 링크한 버전별 QGIS 매뉴얼은 이 심볼 유형과 사용 가능한 제어를 설명합니다.

지도 전체에 심볼을 쓰기 전에 수신자에게 본체 채우기, 외곽선과 불투명도를 각각 검증하도록 요청하세요. 금색 강조 부분의 고정, 의도한 마커 크기에서의 구멍을 확인하고 심볼 파일이 있는 상태에서 공유 프로젝트를 다시 여세요. 청중이 받을 파일인 내보낸 지도나 레이아웃도 확인하세요.

이 검사로 전달을 완료합니다. 브라우저 이미지와 소스 검사는 입력 그림을 다루며 최종 결과는 실제 QGIS 프로젝트가 결정합니다.

아이콘이 래스터 클립아트로 시작할 때

사용자 지정 픽토그램이 PNG나 JPG로만 있다면 PerfectVector 클립아트 SVG 도구가 편집용 벡터 그림을 복원할 수 있습니다. 경로를 확인하고 마커 크기에서 사라지는 세부를 단순화한 뒤 본체와 고정 강조 부분을 나누고 QGIS 매개변수를 추가하세요. 작은 아이콘 준비 가이드는 작은 크기의 원본 선명도와 정리를 다룹니다.

이는 심볼의 모양을 준비합니다. 이미지 지리 참조, 좌표 복원이나 손으로 그린 지도의 정확한 지리 데이터 변환은 하지 않습니다. 손으로 그린 지도 가이드는 이 차이를 설명합니다. 입력에 이미 필요한 벡터 경로가 있으면 직접 사용하세요. SVG 파일 가이드는 내용을 확인하는 데 도움이 됩니다.

FAQ

가져온 SVG 마커에서 원하는 색상 제어가 나오지 않는 이유는 무엇인가요? 관련 페인트 속성에 QGIS 매개변수 자리표시자가 있는지 확인하세요. 이 예제는 본체에만 매개변수를 넣고 금색 강조 부분은 의도적으로 고정합니다. 그런 다음 대상 QGIS 버전에서 제어를 검증하세요.

강조색 하나를 고정할 수 있나요? 그 영역의 채우기를 명시적 색상으로 두고 제어할 영역에만 공유 매개변수를 적용하세요. 소스 검사가 쉽도록 강조 부분을 별도 경로로 유지하세요.

아이콘을 벡터화하면 지리 데이터가 되나요? 아닙니다. 심볼의 그림을 만듭니다. 지도 위치, 좌표와 정확도는 여전히 지리 데이터와 GIS 작업 흐름에 달려 있습니다.

Sources

  1. QGIS 3.44 — 심볼 선택기 — SVG 마커 매개변수와 선택적 기본값을 설명합니다.
  2. MDN — fill-rule — 채워지는 영역과 구멍에 사용한 even-odd 규칙을 설명합니다.
  3. MDN — viewBox — 두 원본 사본이 사용하는 SVG 좌표 사각형을 설명합니다.

래스터 픽토그램은 클립아트를 SVG로 변환하고 구멍과 작은 세부를 확인한 뒤 별도 QGIS 사본을 준비하세요. 일반 원본을 유지하고 전달 전에 수신자가 실제 프로젝트에서 마커 색상과 모양을 테스트하도록 하세요.

블로그의 다른 글

편집하기 쉬운
더 깔끔한 SVG로 다시 시작하세요