icomoon을 사용하여 SVG를 글꼴 아이콘으로 변환

Question

모든 브라우저에서 열 때 svg가 정상적으로 나타납니다. http://icomoon.io/을 사용하여 글꼴 아이콘으로 변환하려고하지만 가져온 후에 제대로 표시되지 않습니다. 나는 http://fontastic.me/을 사용했지만 행운은 없었다.

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="Layer_1" x="0px" y="0px" width="400px" height="400px" viewBox="0 0 400 400" enable-background="new 0 0 400 400" xml:space="preserve" style=" 
    color: red; 
"> 
<path fill="none" stroke="#231F20" stroke-width="15" stroke-miterlimit="10" d="M323.41,321.664c0,0.457-0.371,0.828-0.828,0.828 H88.835c-0.458,0-0.829-0.371-0.829-0.828V87.918c0-0.459,0.371-0.829,0.829-0.829h233.747c0.457,0,0.828,0.37,0.828,0.829V321.664z " style=" 
    color: red; 
"/> 
<path fill="none" stroke="#231F20" stroke-width="15" stroke-miterlimit="10" d="M215.311,196.935"/> 
<path fill="none" stroke="#231F20" stroke-width="15" stroke-miterlimit="10" d="M250.935,277.399 c25.36-14.769,42.409-42.247,42.409-73.71c0-47.078-38.164-85.242-85.242-85.242s-85.242,38.164-85.242,85.242 c0,31.463,17.048,58.941,42.408,73.71"/> 
<g> 
    <path fill="#231F20" d="M173.653,282.14l-4.741-48.439c-0.059-0.58-0.327-1.092-0.715-1.482l-47.088,54.471 c0.48,0.449,1.127,0.714,1.82,0.676l48.578-2.721C172.82,284.568,173.783,283.448,173.653,282.14z"/> 
</g> 
<text transform="matrix(1 0 0 1 175.665 231.1914)" fill="#231F20" stroke="#231F20" stroke-width="2" stroke-miterlimit="10" font-family="'Helvetica'" font-size="99.4919">A</text> 
</svg> 

나는 그것이 이미지를 생성하는 방법을 함께 할 수있는 뭔가가 있지만, 문제를 해결하는 방법에 대한 많은 자료를 찾을 수 없습니다 추측입니다 -

다음은 SVG 이미지 마크 업입니다. 어떤 도움이 굉장 할 것입니다!

감사합니다.

Answer 1

IcoMoon은 획 속성과 텍스트 개체를 무시합니다. 채워진 모양에만 관심이 있습니다. 귀하의 경우에는 원형 곡선의 끝에 삼각형 만 가져올 것입니다.

경로와 텍스트를 채워진 모양으로 변환해야합니다. 잉크 스케이프에서 아트 워크를 선택하고 CtrlShift을 눌러보십시오. 일러스트 레이터에서 경로 메뉴에서 어딘가에 개요 스트로크 옵션과 설명 텍스트를 변환하는 명령이있다, 내가 올바르게 기억, 맥 (아마 제어시프트에 ⌘시프트C 그렇지 않으면).

겹치는 개체가있는 경우 병합해야합니다.

완벽한 결과는 기대하지 마십시오. IcoMoon은 적절한 작업을 수행하지만 일부 상황에서는 곡선을 직선으로 변환 할 수 있습니다.

Answer 2

일러스트 레이터에서 텍스트를 외곽선으로 변환하는 명령은 다음과 같습니다. shift + command + O for mac. 또는 1. 텍스트를 2.를 선택 -> 생성 개요

대한 추가 정보 : http://reachheadwear.com/illustrator-101-creating-outlines