Skip to content

HightLight

In addition to data display, geographical visualization also requires user interaction. User interaction is generally divided into two types.

  • Layer interaction
  • Data interaction

Layer interaction

The mouse performs related operations on the visualization layer, and the layer will respond accordingly.L7ofLayerLayers currently natively support two interaction capabilities.

  • activeMouse over highlight
  • selectMouse selection highlight

active(activeOption | boolean): void

  • Turn on or offmousehoverElement highlighting effect.
  • activeOption
    • color: Highlight color
    • mix: Optional parameter, the default is 0, which means the highlight color is the specified solid color. The maximum valid value is 1, which means the highlight color is all the background color.
// Turn on Active and use the default highlight color
layer.active(true);

// Turn on Active custom highlight color

layer.active({
  color: 'red',
  mix: 0.6,
});

//Turn off the highlight effect
layer.active(false);

select(selectOption | boolean): void

  • Turn on or offmouseclickElement selection highlight effect.
  • selectOption
    • color: Select highlight color
    • mix: Optional parameter, the default is 0, which means that the selected highlight color is the specified solid color. The maximum effective value is 1, which means that all the selected highlight colors are background colors.
// Turn on Active and use the default highlight color
layer.select(true);

// Turn on Active custom highlight color

layer.select({
  color: 'red',
  mix: 0.6,
});

//Turn off the highlight effect
layer.select(false);

Data interaction

Sometimes we may need to directly specify a certain data highlight. For example, when the mouse clicks on the data in the data panel, we need to highlight the corresponding element of the map.

setActive(id: number): void

layer.setActive(id);

setSelect(id: number): void

layer.setSelect(id);
© Copyright 2026 Ant Group Co., Ltd..备案号:京ICP备15032932号-38
Site search
Documentation and examplesType to start searching

Search documentation, APIs, and examples

↑↓Select↵OpenEscClose