Installation

Bir ImageMap için vurgulamayı etkinleştirmek için, onu imageMapHighlighter sınıfıyla bir div ögesi içine alın.

<div class="imageMapHighlighter">
	<imagemap>...</imagemap>
</div>

Configuration

root ögede CSS değişkenleri kullanılarak vurgulanan tüm ImageMap'lere özelleştirme uygulanabilir, bunun gibi:

:root {
	--imagemaphighlight-fill: rgba(0, 0, 0, 0.35); /* ImageMap'te vurgulanan alanların arka planı şeffaf olmalıdır */
	--imagemaphighlight-stroke: #FFC500; /* ImageMap'te vurgulanan alanların etrafındaki kontur */
	--imagemaphighlight-stroke-width: 2; /* ImageMap'te vurgulanan alanların etrafındaki kontur genişliği */
	--imagemaphighlight-legend-highlight: rgba(255, 255, 255, 0.1); /* göstergede vurgulanan alanların arka planı */
}

Vurgu sarmalayıcıya veri nitelikleri eklenerek belirli bir ImageMap'e bazı özelleştirmeler de uygulanabilir.

<div class="imageMapHighlighter"
	data-fill="#0001"
	data-stroke="blue"
>

Açıklama, data-legend ögesini false veya 0 olarak ayarlayarak belirli bir ImageMap için devre dışı bırakılabilir.

<div class="imageMapHighlighter"
	data-legend="false"
>

Example