Есть такое оооочень небольшое предположение, что на Новый Год снега не будет, зато будет хороший плюс. Давайте исправим это: сделаем немного новогоднего волшебства в QlikView!
Qlik-расширение: Снежники, вьюга, снег
Для вас я расскажу, как по-новогоднему украсить любое QlikView, устроив в приложениях настоящую вьюгу. Итак, визуальная магия – устанавливаем и разбираем расширение от Barry Harmsen, которое добавит рождественское настроение к нашему документу QlikView.
В конце поста вы можете скачать расширение.
А сейчас немного теории по созданию и установке расширений QlikView.
Установка расширения
Напоминаю, как добавлять расширения в файлы QlikView.
- В меню программы QlikView заходим в параметры документа (CTRL+ALT+D).
- Заходим во вкладку Расширение
3. Добавляем расширение Snow-Storm и жмем кнопку Ок.
После этого включаем WebView – Урррраааааа!
Вот она – зимняя вьюга!
QlikView: инструкция по созданию расширения
Если вы новичок, то наверняка, возник вопрос: «Как же просмотреть содержание расширения QlikView?». По сути, расширение (QlikView extension) – архивный файл QlikView. Если сделать простую манипуляцию, изменить расширение файла, вы увидите все содержимое расширения. Для активной работы с расширением архив надо распаковать. Ту же последовательность распаковки файлов делает и QlikView, загружая расширение в:
Windows 7:
- C:\Users\[user]\AppData\Local\QlikTech\QlikView\Extensions\Objects
- C:\Users\[user]\AppData\Local\QlikTech\QlikView\Extensions\Document
Windows XP:
- C:\Documents and Settings\[user]\Local Settings\Application Data\QlikTech\QlikView\Extensions\Objects
- C:\Documents and Settings\[user]\Local Settings\Application Data\QlikTech\QlikView\Extensions\Document
Содержимое расширения Snow-Storm.qar:
Ну, а теперь краткая инструкция по созданию расширения Вьюга:
- Создаем папку Snow-Storm.
- В текстовом редакторе (предлагаю воспользоваться, например, полезным и бесплатным Notepad ++) создаем два файла “Definition.xml” и “Script.js”.
Definition.xml – основной файл, в котором QlikView находит мета-информацию для расширения QlikView.
Пишем такой код:
|
1 |
<?xml version="1.0" encoding="utf-8"?> |
|
1 |
<ExtensionObject Label="Да будет Вьюга!" Path="Snow-Storm" Description="Звенит январская вьюга!" Type="document"> |
|
1 |
</ExtensionObject> |
При выполнении этого скрипта в QlikView устанавливается следующая информация:
- Путь (папка) нашего расширения – мы указали папку Snow-Storm.
- Ярлык и Описание – мы указали “Да будет Вьюга!” и “ Звенит январская вьюга!” соответственно. Объект установки – документ.
Теперь поработаем с JavaScript. Код для нашей страницы Script.js будет такой:
|
1 |
Qva.LoadScript("QvAjaxZfc/QvsViewClient.aspx?public=only&type=document&name=Extensions/Snow-Storm/ThreeCanvas.js", function () { |
|
1 |
Qva.LoadScript("QvAjaxZfc/QvsViewClient.aspx?public=only&type=document&name=Extensions/Snow-Storm/Snow.js", snow_storm); |
|
1 |
}); |
|
1 |
function snow_storm() { |
|
1 |
Qva.AddDocumentExtension('Snow-Storm', function () { |
|
1 |
$(document).ready(function(){ |
|
1 |
var SCREEN_WIDTH = window.innerWidth; |
|
1 |
var SCREEN_HEIGHT = window.innerHeight; |
|
1 |
var container; |
|
1 |
var particle; |
|
1 |
var camera; |
|
1 |
var scene; |
|
1 |
var renderer; |
|
1 |
var mouseX = 0; |
|
1 |
var mouseY = 0; |
|
1 |
var windowHalfX = window.innerWidth / 2; |
|
1 |
var windowHalfY = window.innerHeight / 2; |
|
1 |
var particles = []; |
|
1 |
var particleImage = new Image(); |
|
1 |
particleImage.src = "QvAjaxZfc/QvsViewClient.aspx?public=only&type=document&name=Extensions/Snow-Storm/Smoke.png"; //'Smoke.png'; |
|
1 |
function init() { |
|
1 |
container = document.createElement('div'); |
|
1 |
document.body.appendChild(container); |
|
1 |
camera = new THREE.PerspectiveCamera( 75, SCREEN_WIDTH / SCREEN_HEIGHT, 1, 10000 ); |
|
1 |
camera.position.z = 1000; |
|
1 |
scene = new THREE.Scene(); |
|
1 |
scene.add(camera); |
|
1 |
renderer = new THREE.CanvasRenderer(); |
|
1 |
renderer.setSize(SCREEN_WIDTH, SCREEN_HEIGHT); |
|
1 |
var material = new THREE.ParticleBasicMaterial( { map: new THREE.Texture(particleImage) } ); |
|
1 |
for (var i = 0; i < 500; i++) { |
|
1 |
particle = new Particle3D( material); |
|
1 |
particle.position.x = Math.random() * 2000 - 1000; |
|
1 |
particle.position.y = Math.random() * 2000 - 1000; |
|
1 |
particle.position.z = Math.random() * 2000 - 1000; |
|
1 |
particle.scale.x = particle.scale.y = 1; |
|
1 |
scene.add( particle ); |
|
1 |
particles.push(particle); |
|
1 |
} |
|
1 |
container.appendChild( renderer.domElement ); |
|
1 |
document.addEventListener( 'mousemove', onDocumentMouseMove, false ); |
|
1 |
document.addEventListener( 'touchstart', onDocumentTouchStart, false ); |
|
1 |
document.addEventListener( 'touchmove', onDocumentTouchMove, false ); |
|
1 |
setInterval( loop, 1000 / 60 ); |
|
1 |
} |
|
1 |
function onDocumentMouseMove( event ) { |
|
1 |
mouseX = event.clientX - windowHalfX; |
|
1 |
mouseY = event.clientY - windowHalfY; |
|
1 |
} |
|
1 |
function onDocumentTouchStart( event ) { |
|
1 |
if ( event.touches.length == 1 ) { |
|
1 |
event.preventDefault(); |
|
1 |
mouseX = event.touches[ 0 ].pageX - windowHalfX; |
|
1 |
mouseY = event.touches[ 0 ].pageY - windowHalfY; |
|
1 |
} |
|
1 |
} |
|
1 |
function onDocumentTouchMove( event ) { |
|
1 |
if ( event.touches.length == 1 ) { |
|
1 |
event.preventDefault(); |
|
1 |
mouseX = event.touches[ 0 ].pageX - windowHalfX; |
|
1 |
mouseY = event.touches[ 0 ].pageY - windowHalfY; |
|
1 |
} |
|
1 |
} |
|
1 |
// |
|
1 |
function loop() { |
|
1 |
for(var i = 0; i<particles.length; i++) |
|
1 |
{ |
|
1 |
var particle = particles[i]; |
|
1 |
particle.updatePhysics(); |
|
1 |
with(particle.position) |
|
1 |
{ |
|
1 |
if(y<-1000) y+=2000; |
|
1 |
if(x>1000) x-=2000; |
|
1 |
else if(x<-1000) x+=2000; |
|
1 |
if(z>1000) z-=2000; |
|
1 |
else if(z<-1000) z+=2000; |
|
1 |
} |
|
1 |
} |
|
1 |
camera.position.x += ( mouseX - camera.position.x ) * 0.05; |
|
1 |
camera.position.y += ( - mouseY - camera.position.y ) * 0.05; |
|
1 |
camera.lookAt(scene.position); |
|
1 |
renderer.render( scene, camera ); |
|
1 |
} |
|
1 |
init(); |
|
1 |
}); |
|
1 |
}); |
|
1 |
} |
НА ЗАМЕТКУ! Типовая структура расширения:
| Название файла | Описание |
| Расширение.xml | В этом файле даны директивы для QlikView по загрузке мета-данных. |
| Скрипт.js | Расширение загружается только тогда, когда в архиве есть файл Script.js, благодаря фукнции Qv.AddExtension. |
| Значок.png | По сути, это ярлык вашего расширения. В списке расширений будет показана именно эта картинка. Помните, что размер значка не должен превышать 24×24 пикселя. |
| Дополнительные файлы | Дополнительные файлы, которые определяют работу расширения. Это могут быть рисунки, скрипты и иное. |
Отличных вам праздников!
Итак, скачивайте и радуйте коллег и себя рождественским и новогодним настроением!
Snow-Storm — скачать приложение QlikView
И, конечно, поздравляю всех вас с Новым годом и Рождеством! Желаю вам всего лучшего в 2016 году!
Василий Петренко
B3
Максим
Stepan
Павел Карасев
Свежие комментарии