متاسفانه لینک آموزشی ندارم.
در واقع با تابع زیر میشه این کار رو کرد منتها اشکالاتی داره که باید برطرف بشه در صورتیکه برطرف شد ورژن جدید رو میزارم.
var showTitleOnMap = $('#IranMap .show-title-on-map');
if (showTitleOnMap.length === 1) {
var provinceTitle, svgProvincePathClass, provinceTop, provinceLeft;
var svgProvincePath = $('#IranMap svg g.province path');
for (var i = 0; i < svgProvincePath.length; i++) {
svgProvincePathClass = svgProvincePath.eq(i).attr('class');
provinceTop = svgProvincePath.eq(i).offset().top - 20;
provinceLeft = svgProvincePath.eq(i).offset().left-70;
provinceTitle = $('#IranMap .list .province li.' + svgProvincePathClass + ' a').html();
showTitleOnMap.append('<i style="top:'+provinceTop+'px;left:'+provinceLeft+' px">' + provinceTitle + '</i>');
}
}