Skip to main content

SimpleLegend

A simplified legend component for basic map symbology.

πŸ“‹ Overview​

PropertyValue
Filesrc/components/SimpleLegend.tsx
TypeReact Functional Component
AuthorUIP Team
Version1.0.0

🎯 Purpose​

  • Display simple map legend
  • Minimal footprint design
  • Quick reference for colors
  • Non-interactive display

πŸš€ Usage​

import { SimpleLegend } from '@/components/SimpleLegend';

function MapComponent() {
return (
<MapContainer>
<SimpleLegend
items={legendItems}
position="bottomleft"
/>
</MapContainer>
);
}

πŸ“¦ Props​

PropTypeRequiredDefaultDescription
itemsLegendItem[]Yes-Legend items
positionMapPositionNo'bottomleft'Position
titlestringNo-Legend title

πŸ”§ Legend Item​

interface LegendItem {
label: string;
color: string;
shape?: 'circle' | 'square' | 'line';
}

See the complete components reference for all available components.