3D Облако тегов - История изменений

Mad grant в 11:19, 5 июня 2013

2013-06-05T11:19:10Z

Mad grant в 12:59, 18 апреля 2013

2013-04-18T12:59:12Z

Mad grant в 12:58, 18 апреля 2013

2013-04-18T12:58:31Z

XiBOR в 08:10, 20 октября 2012

2012-10-20T08:10:22Z

XiBOR: Новая страница: «В продолжении статьи Простое облако тегов можно добавить к реализации один удобный скр…»

2012-10-20T08:09:06Z

Новая страница: «В продолжении статьи Простое облако тегов можно добавить к реализации один удобный скр…»

Новая страница

В продолжении статьи [[Простое облако тегов]] можно добавить к реализации один удобный скрипт, довольно быстрый и работающий во всех адекватных браузерах нормально понимающих HTML5.

Сам скрипт можно скачать отсюда [[Файл:Tagcanvas.min.zip‎]] или с http://www.goat1000.com/tagcanvas.php <br />
Как это организовать? Очень просто. Извлекаем из архива js-файл и помещаем его в системную папку /js/. <br />
Далее, идем в шаблон /xsltTpls/layouts/default.xsl или тот, в котором вы выполняли действия из предыдущей статьи.<br />
Теперь следует в раздел HEAD, основного шаблона, поместить вызов скрипта и настройки:
<source lang="javascript">

<script charset="utf-8" type="text/javascript" src="/js/tagcanvas.js" />

<script type="text/javascript">
$(document).ready(function() {
if( ! $('#myCanvas').tagcanvas({
textColour : 'orange', //Цвет ссылки
outlineColour: 'black', //Цвет контура
weight: true, //Учитывать вес
outlineThickness : 1, //Толщина контура
zoom: 1.2, //Приближение текста
maxSpeed : 0.02, //Скорость вращения
depth : 0.40, //Глубина (mouse rollover)
textHeight: 16 //Базовый размер текста
}, 'tagcloud')); });
</script>

</source>

Находим место, где хотим разместить наше облако. В данном примере это будет левый блок (под категориями).<br />
Размер этой колонки 190px, это важно учитывать при написании canvas.<br />
Создаем область:
<source lang="html4strict">
<canvas width="190" height="190" id="myCanvas">
<div id="tagcloud">
<xsl:apply-templates select="document('udata://stat/tagsCloud//10/9')/udata/lines" mode="tags" />
</div>
</canvas>
</source>
в макросе stat/tagsCloud третий параметр отвечает за максимальный размер текста, приходящий в xml. Установим значение как 9, для того, чтобы указывать это число как остаток для единицы измерения em.

Сам же шаблон отличается от примера из предыдущей статьи использованием атрибута @font-size для более корректного отображения. И неиспользованием обрамляющих тегов.
<source lang="xml">
<xsl:template match="item" mode="tags">
<a style="font: 1.{@font-size}em sans-serif;" href="/content/pagesByDomainTags/{.}">
<xsl:value-of select="." />
</a>
</xsl:template>
</source>

[[Категория:Вопросы и уроки разработки сайтов на UMI.CMS]][[Категория:Сторонние сервисы и программы]]

← Предыдущая		Версия 11:19, 5 июня 2013
Строка 1:		Строка 1:
		+	'''Актуально для версии 2.9'''
		+
	В продолжении статьи [[Простое облако тегов]] можно добавить к реализации один удобный скрипт, довольно быстрый и работающий во всех адекватных браузерах нормально понимающих HTML5.		В продолжении статьи [[Простое облако тегов]] можно добавить к реализации один удобный скрипт, довольно быстрый и работающий во всех адекватных браузерах нормально понимающих HTML5.

@@ Строка 48: / Строка 48: @@
 Всё, облако тегов в 3D на сайте установлено.
 Статья актуальная для версии 2.8.5.3 при наличии подключенной библиотеки jQuery.
-[[Категория:Вопросы и уроки разработки сайтов на UMI.CMS]][[Категория:Сторонние сервисы и программы]][[Модуль Статистика]]
+[[Категория:Вопросы и уроки разработки сайтов на UMI.CMS]][[Категория:Сторонние сервисы и программы]][[Категория:Модуль Статистика]]

@@ Строка 48: / Строка 48: @@
 Всё, облако тегов в 3D на сайте установлено.
 Статья актуальная для версии 2.8.5.3 при наличии подключенной библиотеки jQuery.
-[[Категория:Вопросы и уроки разработки сайтов на UMI.CMS]][[Категория:Сторонние сервисы и программы]]
+[[Категория:Вопросы и уроки разработки сайтов на UMI.CMS]][[Категория:Сторонние сервисы и программы]][[Модуль Статистика]]

← Предыдущая		Версия 08:10, 20 октября 2012
Строка 46:		Строка 46:
	</source>		</source>

		+	Всё, облако тегов в 3D на сайте установлено.
		+	Статья актуальная для версии 2.8.5.3 при наличии подключенной библиотеки jQuery.
	[[Категория:Вопросы и уроки разработки сайтов на UMI.CMS]][[Категория:Сторонние сервисы и программы]]		[[Категория:Вопросы и уроки разработки сайтов на UMI.CMS]][[Категория:Сторонние сервисы и программы]]