2016-06-01 2 views
1

xsl-fo를 사용하여 이미지를 그릴 필요가 있고 사용자가 이미지의 텍스트/특정 위치 내를 클릭 할 수 있어야한다는 요구 사항이 있습니다. 더xsl-fo의 영역 속성 좌표가있는 외부 그래픽

  • 그것을 설명하기 위해 나는 그것은
  • 내가 텍스트가 발생하는 위치의 좌표가 그 좌표에 대한 하이퍼 링크를 제공 할 필요가 텍스트
  • 을 포함하는 이미지
  • 있습니다.

그래서 텍스트를 클릭하면 PDF 문서의 다른 위치로 이동할 수 있습니다.

<area> 태그는 <fo:block> 내의 좌표를 언급했지만 태그가 작동하지 않습니다.

<fo:block> <fo:external-graphic content-width="scale-to-fit" content-height="100%" width="100%" src="figures/test.png"/><area shape="rect" coords="148,147,195,162" <fo:basic-link>xyz</fo:basic-link></area> 
</fo:block> 

당신이 사람이 이런 식으로 뭔가를 시도했는지 알려 저를 도와 주 시겠어요 다음과 같이 내 FO 구조는?

+1

으로 내 지식은 XSL-FO에서 imagemap과 비슷한 것이 아무것도 없다. – potame

답변

1

XSL-FO는 않지만 하지 이미지 맵 (HTML에서 MAP 요소 유사한 일이),이 같은 결과를 달성하기 위해 포함 된 SVG 문서을 사용할 수 있습니다.

  • image 요소는 a 뷰 박스
  • 문서의 동일한 크기를 갖는, 비트 맵 이미지를 배치 : SVG 문서 내부

    <fo:block> 
        <fo:instream-foreign-object> 
         <svg width="5cm" height="3cm" viewBox="0 0 5 3" version="1.1" 
          xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> 
          <image x="0" y="0" width="5" height="3" xlink:href="image.png"/> 
          <a xlink:href="http://www.w3.org"> 
           <rect x="1" y="2" width="3" height="1" 
             fill="#AAFFFF" stroke="none" opacity="0"/> 
          </a> 
         </svg> 
        </fo:instream-foreign-object> 
    </fo:block> 
    

    :

    이 예를 보라 요소가 링크 대상을 정의합니다.
  • rect 요소가 a def 내에 있습니다. 아이 네스 클릭 가능한 영역

내가 FOP 2.1이 예제를 테스트하고 주의의 부부와 함께, 작동합니다

내가 opacity="0"을 사용하는 클릭 가능한 사각형이 완전히 투명하게하기 위해
  • ; 나는 fill="none" stroke="none"를 사용하여 시도하지만이 사각형이 완전히 삭제되었습니다 아마도 때문에, 작동하지 않는/눈에 보이는 표를 가지고 있지 무시
  • SVG에 ellipse 요소를 사용하는 경우에도 PDF의 클릭 가능한 영역은 직사각형
+0

위의 대답은 유용하지만 속성을 추가 할 수 없습니다. 추가 할 때 ** "요소의 너비"는 입니다. "** 따라서 을 제거했으며 이미지가 생성되었습니다. 그러나 모든 이미지는 모든 PDF 이미지와 마찬가지로 선택됩니다. 이미지의 특정 부분은 선택 가능하며 하이퍼 링크와 함께 제공되지 않습니다. –

+0

@DhineshM 직사각형 (x1, y1, x2, y2) 좌표를 알고 있다면 (예에서'coords = "148,147,195,162"') 쉽게 그들을 사용하여'x','y','width ''rect' 엘리먼트를 적절하게 정의하는데 필요한'height' 속성은'width'는 x2 - x1,'height'는 y2 - y1입니다. – lfurini

+0

@DhineshM 실제로 좌표 원점의 위치에 따라 다릅니다 (SVG 축의 원점은 왼쪽 위 모서리, 양수 x는 오른쪽, 양수 ​​y는 아래쪽). 'opacity = "0.5"''를 설정하면 직사각형이 반투명 해지고 그 위치를 볼 수 있고 올바른 위치와 크기를 계산하고 있는지 확인할 수 있습니다. – lfurini