Skip to content

Image Loaders ​

There are two methods for placing points on a map: 1) Using Markers; 2) Using SymbolLayer.

Marker ​

  • Advantages
    • This method is flexible; any element that can be rendered on a web page can be used for placing points.
  • Disadvantages
    • Creates DOM elements. When there are a large number of points, this consumes a significant amount of memory, leading to page lag.
    • Does not support point clustering or expansion effects.

SymbolLayer ​

  • Advantages
    • Does not require creating DOM elements, making it suitable for use with a large number of points.
    • Supports clustering and expansion effects
  • Disadvantages
    • Requires using an image loader when using icons, which is slightly cumbersome

Image Loaders ​

All image loaders are designed for use with SymbolLayer for placing points. This component library provides the following loaders

  • ImageLoader,Static image loader, can be used to load formats such as PNG, JPG, and SVG
  • ImageGifLoader,Used to load GIF animations, implemented using the omggif library
  • ImageLottieLoader,Used to load Lottie animations; requires the application to use the lottie-web library
  • ImageApngLoader,Used to load APNG animations, implemented using the apng-js library
  • ImageFrameLoader,Used to load frame animations
  • VideoMp4Loader,Used to load H.264 encoded MP4 videos, implemented using the mp4box library (this loader has several limitations; please use with caution)