Jump to content

Вставка некоторого количества html+js

metrpro
metrpro
in Invision Community 4 Support

Featured Replies

Posted
comment_95413

Есть форумы.

В некотором количестве разделов требуется вставить Яндекс. Карту, но не напрямую через Конструктор - с этим проблем нет через кнопку "источник" при добавлении/редактировании формы, а именно через html+javascript.

вариантов я вижу 2. Первый - это изменять шаблоны конкретных разделов, но я не знаю, как это сделать, меняется шаблон всего форума.

Второй - это вставлять в конкретное сообщение. Но как бы ни бился, в т.ч. через "источник", ничего не выводится.

Код: 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Вариант-2 - Отображение данных из csv-афйла на Яндекс.Картах - Версия для API 2.x</title>
<script src="http://api-maps.yandex.ru/2.0/?load=package.full&lang=ru-RU" type="text/javascript"></script>
<script src="http://yandex.st/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript">
var myMap, myCollection;
ymaps.ready(function  () {
	myMap = new ymaps.Map('ymapid', {
                    center: [56.3241,44.0014],
                    zoom: 15,
					behaviors: ["scrollZoom","drag"]
                });	
			
	myCollection = new ymaps.GeoObjectCollection();			
				
	$.ajax({
	url:'http://forums.metrpro.ru/map_evp.csv',
			success: function(data){
			var rows = data.split("\n");
			var src_res='';
			for(var i in rows){
			var colls=rows[i].split(";");//или другой символ разделитель
			
			// Устанавливаем координаты и содержимое балуна
			myPlacemark = new ymaps.Placemark([colls[5], colls[4]], {
                    // Свойства 
					iden: colls[0],	
                    balloonContentHeader: '<div style="color:#ff0303;font-weight:bold">'+colls[1]+'</div>',
                    balloonContentBody: '<div style="font-size:12px;"><strong>Адрес:</strong> '+colls[2]+'<br /><strong>Телефон:</strong> '+colls[3]+'</div>'              
                }, {
                    // Опции
                    preset: 'twirl#carIcon'
                });

             myCollection.add(myPlacemark);
			
			$('#menu').append('<li>'+'<a href="#" onClick="return go_point('+colls[0]+");"+'\">'+colls[1]+'</a></li>');
			}
			myMap.geoObjects.add(myCollection);
			
			myMap.setBounds(myCollection.getBounds());
			}
	
	
	});			

});

function go_point(id){
myCollection.each(function (item) {
if (item.properties.get('iden') == id) {
var coord = item.geometry.getCoordinates();
myMap.setCenter(coord, 16);
item.balloon.open();
}
});	

}

</script>

<style type="text/css">

            #menu {
                list-style: none;
                margin: 0;
                padding: 0;
            }

            #menu a {
                text-decoration: none;
                border-bottom: dashed 1px;
            }            

            a.active {
                color: #000;
            }

</style>

</head>

<body>

<table>
    <tr>

        <td valign="top"><div id="ymapid" style="width:800px;height:600px"></div></td></tr><tr>
		<td valign="top"><ul id="menu"></ul></td>

    </tr>
</table>

</body>
</html>

Будучи вбитым в отдельный файл html, код прекрасно работает.

Помогите! Как мне отображать его на форумах в конкретной теме?

  • Цитата
    • Link to comment
    https://ipbmafia.ru/topic/12769-vstavka-nekotorogo-kolichestva-htmljs/
    Share on other sites
    comment_95431

    Как вариант вставить в пост куда-нибудь или в блок, а сами данные в файл закатать и положить в корень например или в другое место  

    <iframe border="0" frameborder="0" align="center" width="100%" height="70" src="путь/файл.html" scrolling="no"></iframe>

  • Цитата
    • Author
    comment_95437
    52 минут назад, Dows сказал:

    Как вариант вставить в пост куда-нибудь или в блок, а сами данные в файл закатать и положить в корень например или в другое место  

    <iframe border="0" frameborder="0" align="center" width="100%" height="70" src="путь/файл.html" scrolling="no"></iframe>

    Спасибо, как рабочий вариант приемлемо, только не получается карту сделать на 100% ширины - сам фрэйм растянут на всю ширину, а вот блок div, предусмотренный в файле, не хочет прописывать в style на 100% - просто не отображается карта в таком случае.

  • Цитата
    comment_95442

    <div style="width: auto; height: (указать высоту); "></div> это для дива карты самой

  • Цитата
    • Author
    comment_95445
    Только что, Dows сказал:

    <div style="width: auto; height: (указать высоту); "></div> это для дива карты самой

    Не пашет... Перестает фрэйм выводится...

  • Цитата
    comment_95450

    В стиль

    #ymapid{ 
        width: auto;
        height: 768px;

    }

    для  <table width="100%">

    А из <div style=""> убрать параметр ширины

  • Цитата
    • Author
    comment_95455
    Только что, Dows сказал:

    В стиль

    #ymapid{ 
        width: auto;
        height: 768px;

    }

    для  <table width="100%">

    А из <div style=""> убрать параметр ширины

    Блин, ты вообще человечище! СПАСИБО!!!!

  • Цитата

    • Join the conversation

    You can post now and register later. If you have an account, sign in now to post with your account.
    Note: Your post will require moderator approval before it will be visible.

    Guest
    Ответить в этой теме...
    Go to topic listing

    Последние посетители 0

    • No registered users viewing this page.