Bar chart

The following script generates a bar chart Card using the chart template from static JSON data.

To test this example, create a new Postman GET request to https://postman-echo.com/get, paste the script provided into the Tests tab and click Send. The rendered Card can be viewed in the Visualize tab of the response pane.

To learn how to use Postman request responses with Universal Card Templates, refer to the guide Build a new connector with Postman.

var model = {
    "_card": {
        type: "chart",
        title: "",
    },
    "chart": {
        template: 'bar',
        palette: 'office.Office6',
        configuration: {
            data: {
                labels: ['UK', 'USA', 'Germany'],
                datasets: [
                    {
                        label: '2018',
                        data: [143, 496, 284]
                    },
                    {
                        label: '2019',
                        data: [186, 348, 232]
                    }
                ]
            },
            options: {
                title: {
                    display: true,
                    text: 'Order Volume'
                }
            }
        }
    }
};

var template = `<script id="loader" src="https://components.adenin.com/components/at-card-preview/loader.js"></script>`;

pm.visualizer.set(template, model);

When rendered, the above definition produces the following chart:

Rendered order volume chart