MapBarAxis Constructor

Syntax

PP.MapBarAxis(settings: Object);

Parameters

settings. JSON object that contains values of class properties.

Description

The MapBarAxis constructor creates an instance of the MapBarAxis class.

Example

To execute the example the HTML page must contain the MapChart component named map (see Example of Creating the MapChart Component). Create a bar factor for a map layer area with the RU-KYA identifier containing axis and showing data only for the first time period:

// Return a layer with map areas
function getWorkLayer() {
    return map.getLayer("Regions");
}
// Return current dimension selection for the map axis
function getSelectedIndex() {
    return 2;
}
// Return a base class of the map bar factor
function getBarVisual() {
    return map.getVisuals().barVisual0;
}
// Return the map layer area with selected identifier
function getShape(shapeId) {
    var shape = getWorkLayer().getParentLayer().getShape(shapeId);
    map.setBarHoverness(shape);
    return shape;
}
// Return settings of data mapping to the height of visualizer items
function getHeightMapping() {
    return getBarVisual().getHeightMappings()[0];
}
// Define settings of data mapping
function setupHeightMapping() {
    getHeightMapping().setType(PP.DataMappingType.Transformer);
    var dataTransformer = new PP.CoordinateTransformer({
        IncludeZero: true,
        UseSignDivision: true,
    });
    dataTransformer.getValue = function getValue(data) {
        if (!this.getUseSignDivision()) {
            return this.getValue(data);
        } else {
            // Double input values
            return data * 2;
        }
    }
    getHeightMapping().setDataTransformer(dataTransformer);
}
// Create an axis for bar factor
function createBarAxis() {
    var barAxis = new PP.MapBarAxis({
        Pen: new PP.Pen({
            Color: PP.Color.Colors.black, // Tick mark color
            Style: PP.PenStyle.Dashed, // Style of the tick mark line
            Width: 4 // Tick mark width
        }),
        Visibility: PP.Ui.Visibility.Hidden
    });
    // Prepare the axis for drawing
    barAxis.prepareToRender(map.getBarLayer());
    return barAxis;
}
// Hide the axis for the bar factor
function hideAxis(mapBar) {
    mapBar.getAxis().setVisibility(PP.Ui.Visibility.Hidden);
    mapBar.refresh();
}
// Show the axis for the bar factor
function showAxis(mapBar) {
    mapBar.getAxis().setVisibility(PP.Ui.Visibility.Visible);
    mapBar.refresh();
}
// Create a bar factor
function createMapBar() {
    // Create a bar factor
    var mapBar = new PP.MapBar({
        Axis: createBarAxis(), // Axis for Bar view
        AllPeriod: false,
        Chart: map,
        Shape: getShape("RU-KYA"), // Map layer area for which factor is created
        BorderThickness: 0.5, // Column border width
        Visual: getBarVisual(),
        // Column width with a minimum value
        LeastWidthPart: getHeightMapping().getDataTransformer().getValue(2.5),
        // Column height with a minimum value
        LeastHeightPart: getHeightMapping().getDataTransformer().getValue(17.5),
        IsPercentage: true
    });
    mapBar.refresh = function () {
        this.getChart().draw();
    }
    return mapBar;
}
// Render a bar factor
function drawMapBar(mapBar) {
    mapBar.setSelectedIndex(getSelectedIndex());
    mapBar.getLayer().getMapBarCollection().push(mapBar);
    // Re-render a map
    mapBar.refresh();
}
// Define settings of data mapping
setupHeightMapping();
// Create a bar factor
var mapBar = createMapBar();
// Render this factor
drawMapBar(mapBar);
// Show the factor
showAxis(mapBar);

After executing the example, the bar factor for the map layer area with the RU-KYA identifier containing axis and showing data only for the first time period is created:

See also:

MapBarAxis