addShape(shapeObj: PP.MapShape, id: Number, domNode: SVGElement, gShapeData: Array, verticesData, index: Number);
shapeObj. Map layer area to be added.
id. Map layer area ID.
domNode. The DOM item that corresponds to map layer area.
gShapeData. Array of strings that contain area data for the map based on a Google topobase. Optional parameter.
verticesData. Data of map layer area nodes.
The addShape method adds a map area in the current layer.
To execute the example the HTML page must contain the MapChart component named map (see Example of Creating the MapChart Component). Delete all items from the map areas layer, and add an area with the RU-KYA identifier. Next highlight all available areas:
// Get the layer with map areas
var regions = map.getLayer("Regions");
// Get DOM item corrresponding to the map layer area with the RU-KYA ID
var shapeDomNode = map.getShape("RU-KYA").getDomNode();
// Create new map layer area
var newShape = new PP.MapShape({
Chart: map,
ParentLayer: regions,
Id: "RU-KYA" // Area ID
});
// Clear the list of the map layer areas
regions.clearShapes();
// Set DOM item for the map area
newShape._DomNode = shapeDomNode;
// Add the map area on the layer
regions.addShape(newShape, newShape.getId(), newShape.getDomNode());
// Highlight all areas of the layer on the map
for (var shapeId in regions.getShapes()) {
var shape = map.getShape(shapeId);
// Get effect of the area border
var effect = shape.getEffect();
// Change border thickness
effect.setBorderThickness(3);
// Apply effect
effect.apply(shape, true);
};
After executing the example only the map layer area with the RU-KYA ID is highlighted, other areas are removed:
See also: