ikarus/sps-visualizer-component

v0.8.5 2023-05-27 11:28 UTC

This package is auto-updated.

Last update: 2024-09-27 14:16:17 UTC


README

可视化包附带CSS和JavaScript库,让您实时设计SPS中发生情况的虚拟可视化。

此包直接交付,可直接包含在Skyline CMS应用程序中。

安装

$ composer require ikarus/visualizer-component

使用方法

您可以为Skyline模板定义如下
my-template.view.phtml

<?php
/**
 * @title My Template
 * @require jQuery
 * @require API
 * @require Visualizer
 */
?>
<div class="content">
    <div class="ikarus console w-60 h-3" id="ikarus-console"></div>
    <div class="ikarus canvas w-60 h-45" id="ikarus-canvas">...</div>
    <script type="application/javascript">
        const VISUALIZER = new Ikarus.Visualizer(new Ikarus.APICommunication('/api/v1/my-sps-server', 'domain1 domain2'), 250, 'my-id');
    
        VISUALIZER.use(new Ikarus.BrickStatusHandlerPlugin());
        VISUALIZER.use(new Ikarus.BrickMasterStatusPlugin());
        VISUALIZER.use(new Ikarus.ValueEditionPlugin());
        VISUALIZER.use(new Ikarus.BrickPanelPlugin());
        VISUALIZER.use (new Ikarus.ConsolePlugin(document.getElementById('ikarus-console')));

        VISUALIZER.updateFromCommunication(true);
    </script>
</div>