How to use the @hpcc-js/layout.HorizontalList function in @hpcc-js/layout

To help you get started, we’ve selected a few @hpcc-js/layout examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github hpcc-systems / Visualization / tests / test-layout / src / layout.spec.ts View on Github external
.columns(data.ND.subjects.columns)
                                    .data(data.ND.subjects.data)
                                );
                                break;
                            case Legend:
                                break;
                            case HorizontalList:
                                const hlData: Array<[string, number, number]> = [
                                    ["A", 34, 21],
                                    ["B", 55, 34],
                                    ["C", 54, 90],
                                    ["D", 80, 153],
                                    ["E", 86, 92],
                                    ["F", 144, 233]
                                ];
                                render(new HorizontalList()
                                    .itemMinWidth(85)
                                    .itemMinHeight(68)
                                    .widgets(hlData.map(function (row) {
                                        return new EntityCard()
                                            .icon("")
                                            .title(row[0])
                                            .description("sum: " + (row[1] + row[2]))
                                            .iconColor("#000")
                                            .backgroundShape("rect")
                                            .backgroundColorFill("#c8d6e5")
                                            .backgroundColorStroke("#576574")
                                            ;
                                    }))
                                );
                                break;
                            case VerticalList:
github hpcc-systems / Visualization / demos / gallery / samples / layout / HorizontalList.js View on Github external
import { EntityCard } from "@hpcc-js/common";
import { HorizontalList } from "@hpcc-js/layout";

const data = [
    ["A", 34, 21],
    ["B", 55, 34],
    ["C", 54, 90],
    ["D", 80, 153],
    ["E", 86, 92],
    ["F", 144, 233]
];
new HorizontalList()
    .widgets(data.map(row=>{
        return new EntityCard()
            .icon("")
            .title(row[0])
            .description('sum: '+(row[1] + row[2]))
            .iconColor("#000")
            .backgroundShape("rect")
            .backgroundColorFill("#c8d6e5")
            .backgroundColorStroke("#576574")
            ;
    }))
    .target("target")
    .itemMinWidth(85)
    .itemMinHeight(68)
    .render()
    ;