원형 차트 이미지에서 링크 만들기

Question

원형 차트가 5 개의 동일한 섹션 이미지가 있습니다. 각 섹션에 대한 롤오버를 작성하여 각 섹션뿐만 아니라 텍스트를 포함하는 팝업 툴팁을 생성하고 싶습니다. 다른 페이지로 연결.

나는 이것이 상당히 복잡 할 수 있다는 것을 알고 있으며, 따라서 5 개의 섹션을 각각 클릭 할 수 있도록 만드는 아이디어를 가지고있다. 그러면 페이지에 설정된 북마크로 사용자가 이동하게된다. 그러나 나는 각 섹션이 개별적으로 연결되도록 원형 차트를 분리하는 방법을 아직 모르고 있습니다.

파이 차트에는 각 섹션마다 맞춤 텍스트가 있으므로 내가 찾은 일반적인 파이 차트 솔루션을 사용할 수 없습니다. 원형 차트는 현재 하나의 이미지로 구성되어 있으며 필요한 경우 이미지를 편집 할 수 있습니다.

어떤 도움을 주셔서 감사합니다.

Answer 1

이미지 맵을 사용합니다. 여기에 대한 자세한 내용은 여기를 참조하십시오. http://www.w3schools.com/tags/tag_map.asp

나는 좌표를 표시하기 위해 Dreamweaver를 사용하지만 이미지를 업로드하고 온라인으로 포인트를 표시 할 수있는 온라인 사이트를 찾을 수 있습니다.

완성 된 코드는 다음과 같을 것이다 : 당신은 당신의 파이 차트를 형성하고 또한이를 클릭 할 가지고 CSS3 모양을 사용할 수 있습니다

<img src="planets.gif" width="145" height="126" alt="Planets" usemap="#planetmap"> 

<map name="planetmap"> 
<area shape="rect" coords="0,0,82,126" href="sun.htm" alt="Sun"> 
<area shape="circle" coords="90,58,3" href="mercur.htm" alt="Mercury"> 
<area shape="circle" coords="124,58,8" href="venus.htm" alt="Venus"> 
</map>