.

VaKeR CYBER ARMY

Server : Apache/2.4.41 (Ubuntu)
System : Linux absol.cf 5.4.0-198-generic #218-Ubuntu SMP Fri Sep 27 20:18:53 UTC 2024 x86_64
User : www-data ( 33)
PHP Version : 7.4.33
Disable Function : pcntl_alarm,pcntl_fork,pcntl_waitpid,pcntl_wait,pcntl_wifexited,pcntl_wifstopped,pcntl_wifsignaled,pcntl_wifcontinued,pcntl_wexitstatus,pcntl_wtermsig,pcntl_wstopsig,pcntl_signal,pcntl_signal_get_handler,pcntl_signal_dispatch,pcntl_get_last_error,pcntl_strerror,pcntl_sigprocmask,pcntl_sigwaitinfo,pcntl_sigtimedwait,pcntl_exec,pcntl_getpriority,pcntl_setpriority,pcntl_async_signals,pcntl_unshare,
Directory : /var/www/html/libs/absol-acomp/demo/

Upload File :

Current File : /var/www/html/libs/absol-acomp/demo/linercolorbar.html

<!DOCTYPE html>
<html>

<head>
    <title>LinearColorBar</title>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="https://absol.cf/hightlight/styles/default.css">
    <!-- <link rel="stylesheet" href="https://absol.cf/materialdesignicons/materialdesignicons.min.css"> -->
    <script src="../dist/absol-acomp.js?<?php  echo stat('../dist/absol-acomp.js')['mtime'];?>"></script>

    <script src="https://absol.cf/hightlight/highlight.pack.js"></script>
    <style>
        .dark.bg {
            background-color: rgba(30, 30, 32, 1);
            /* background-color: white; */

        }

        .bg {
            padding-top: 10em;
            padding-bottom: 10em;
            border: solid 1px rgb(30, 30, 32);
        }
    </style>
</head>

<body>
    <script class="viewable">
        {
            absol._({
                tag: 'linearcolorbar',
                style: {
                    fontSize: 12 + 'px',
                    fontFamily: '"Helvetica Neue\", Arial',
                    margin: '12px',
                    width: '80vw'
                },
                props: {
                    value: 0.7,
                    extendValue: 0.3,
                    minValueText: '0%',
                    maxValueText: '100%',
                    valueText: '70%',
                    colorMapping: 'performance'
                }
            }).addTo(document.body);

            absol._({
                tag: 'linearcolorbar',
                style: {
                    fontSize: 12 + 'px',
                    fontFamily: '"Helvetica Neue\", Arial',
                    margin: '12px',
                    width: '50vw'
                },
                props: {
                    value: 1.2,
                    extendValue: 0.3,
                    minValueText: '0%',
                    maxValueText: '100%',
                    valueText: '150%',
                    colorMapping: 'performance'
                }
            }).addTo(document.body);

            absol._({
                tag: 'linearcolorbar',
                style: {
                    fontSize: 12 + 'px',
                    fontFamily: '"Helvetica Neue\", Arial',
                    margin: '12px',
                    width: '30vw'
                },
                props: {
                    value: 1.3,
                    extendValue: 0.3,
                    minValueText: 'An toàn',
                    maxValueText: 'Nguy hiểm',
                    valueText: 'Rất nguy hiểm',
                    colorMapping: 'performance-invert'
                }
            }).addTo(document.body);

            absol._({
                tag: 'linearcolorbar',
                style: {
                    fontSize: 24 + 'px',
                    fontFamily: '"Helvetica Neue\", Arial',
                    margin: '12px',
                    width: '80vw'
                },
                props: {
                    value: 1.2,
                    extendValue: 0.3,
                    minValueText: '0%',
                    maxValueText: '100%',
                    valueText: '150%',
                    colorMapping: 'rainbow'
                }
            }).addTo(document.body);

            absol._({
                tag: 'linearcolorbar',
                style: {
                    fontSize: 8 + 'px',
                    fontFamily: '"Helvetica Neue\", Arial',
                    margin: '12px',
                    width: '30vw'
                },
                props: {
                    value: 0.52,
                    extendValue: 0.3,
                    minValueText: '0%',
                    maxValueText: '100%',
                    valueText: '52%',
                    colorMapping: 'rainbow-invert'
                }
            }).addTo(document.body);

              absol._({
                tag: 'stackedhorizontalbar',
                props: {
                    values: [3,5,8, 6],
                    colors:['red', 'green', 'blue', 'yellow'],
                    pxPerUnit: 20
                }
            }).addTo(document.body);
        }
    </script>
    <script src="https://absol.cf/absol/demo/autohightlighting.js"></script>

</body>

</html>

VaKeR 2022