@kazhan

Как добавить поверх SVG картинки — png?

Доброго времени суток!
Пытаюсь вывести поверх SVG - png картинку и не выходит. Стараюсь сделать карту на которой есть города, а возле каждого города небольшой логотип. примерно 24х24.

<?require($_SERVER["DOCUMENT_ROOT"]."/bitrix/header.php");
$APPLICATION->SetTitle("Карта ");
?>        <link rel="stylesheet" href="/ammap/ammap.css" type="text/css">
        <script src="/ammap/ammap.js" type="text/javascript"></script>
        <!-- map file should be included after ammap.js -->
		<script src="/ammap/maps/js/worldLow.js" type="text/javascript"></script>

		<script type="text/javascript">
			var map;
			var image;
			// svg path for target icon
			var targetSVG = "M9,0C4.029,0,0,4.029,0,9s4.029,9,9,9s9-4.029,9-9S13.971,0,9,0z M9,15.93 c-3.83,0-6.93-3.1-6.93-6.93S5.17,2.07,9,2.07s6.93,3.1,6.93,6.93S12.83,15.93,9,15.93 M12.5,9c0,1.933-1.567,3.5-3.5,3.5S5.5,10.933,5.5,9S7.067,5.5,9,5.5 S12.5,7.067,12.5,9z";
			// svg path for plane icon
			var planeSVG = "M19.671,8.11l-2.777,2.777l-3.837-0.861c0.362-0.505,0.916-1.683,0.464-2.135c-0.518-0.517-1.979,0.278-2.305,0.604l-0.913,0.913L7.614,8.804l-2.021,2.021l2.232,1.061l-0.082,0.082l1.701,1.701l0.688-0.687l3.164,1.504L9.571,18.21H6.413l-1.137,1.138l3.6,0.948l1.83,1.83l0.947,3.598l1.137-1.137V21.43l3.725-3.725l1.504,3.164l-0.687,0.687l1.702,1.701l0.081-0.081l1.062,2.231l2.02-2.02l-0.604-2.689l0.912-0.912c0.326-0.326,1.121-1.789,0.604-2.306c-0.452-0.452-1.63,0.101-2.135,0.464l-0.861-3.838l2.777-2.777c0.947-0.947,3.599-4.862,2.62-5.839C24.533,4.512,20.618,7.163,19.671,8.11z";

			var img = document.createElement("img");
			img.src = "/711/img/W6.png";
			AmCharts.ready(function() {
			    map = new AmCharts.AmMap();
			    map.pathToImages = "/ammap/images/";


			    var dataProvider = {
			        mapVar: AmCharts.maps.worldLow
			    };

			    map.areasSettings = {
			        unlistedAreasColor: "#ebebeb"
			    };
				map.textSeettings = {
					color:"#5b9f2c"};
			    map.imagesSettings = {
			        color: "#5b9f2c",
			        rollOverColor: "#51c802",
			        selectedColor: "#3179a3"
			    };

			    map.linesSettings = {
			        color: "#306170",
			        alpha: 0.4
			    };

			    // KIEV
			    var london = {
			        id: "london",
			        color: "#3179a3",
			        svgPath: targetSVG,
			        title: "Київ",
			        latitude: 50.4422,
			        longitude: 30.5367,
			        scale: 1.7,
			        zoomLevel: 4.64,
			        zoomLongitude: 17,
			        zoomLatitude: 43,
					label: "KYIV ",
					labelColor: "#5b9f2c",
			            labelRollOverColor: "#5b9f2c",

{
			        svgPath: targetSVG,
			        title: "Кельн",
			        latitude: 50.942537,
			        longitude: 6.955306,
			        label:"Кельн",
                                img.src = "/711/img/W6.png",
					labelColor: "#5b9f2c",
			        labelRollOverColor: "#5b9f2c",},


Подскажите пожалуйста!
  • Вопрос задан
  • 633 просмотра
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы