Skip to main content

Search

The Search feature provides comprehensive symbol search capabilities for the financial charting library. This system enables users to search for financial instruments across multiple exchanges and asset types using flexible search criteria.

Key Features​

  • Symbol name search (e.g., "AAPL", "TSLA")
  • Full name search (e.g., "Apple Inc.", "Tesla Inc.")
  • Exchange filtering (NSE, BSE, NYSE, NASDAQ)
  • Asset type filtering (equity, futures, options, crypto)
  • Case-insensitive matching
  • Local cache for improved performance
  • Backend API integration

Architecture / Behavior​

The search system follows a layered architecture:

  1. UI Layer: Top toolbar search input with autocomplete suggestions
  2. API Layer: ChartApi and GlobalApi search methods
  3. Data Feed Layer: Data feed implementations handle actual search queries
  4. Cache Layer: Local caching system for frequently searched symbols

The search process flows from UI → ChartApi → GlobalApi → DataFeed → Backend API → Response → Cache → UI.

API Usage​

Initialization​

The search feature is enabled by default in the chart configuration:

const chart = Chart.create(document.getElementById('container'), {
  // ... other options
  enabled_features: ['search'], // Enable search functionality
});

Methods​

ChartApi.searchSymbols() - Search for symbols using the active chart's data feed:

// Search for symbols containing "AAPL"
const results = await chart.getApi().searchSymbols('AAPL');

// Search for symbols on NSE exchange
const nseResults = await chart.getApi().searchSymbols('ITC', 'NSE');

// Search for equity symbols
const equityResults = await chart.getApi().searchSymbols('RELIANCE', 'NSE', 'EQUITY');

GlobalApi.searchSymbols() - Search across all available data feeds:

// Search across all connected brokers/data feeds
const allResults = await chart.getGlobalApi().searchSymbols('GOOGL');

Configuration Options​

OptionTypeDefaultDescription
enabled_featuresstring[]['search']Enable/disable search functionality
search_cache_ttlnumber300000 (5 min)Cache timeout in milliseconds
search_max_resultsnumber100Maximum number of search results
search_debounce_msnumber300Debounce delay for search input

Events​

  • search:started - Fired when search begins
  • search:completed - Fired when search completes successfully
  • search:failed - Fired when search fails
  • search:result - Fired for each search result

Customization​

  • UI styling can be customized via CSS classes
  • Search behavior can be customized through data feed implementation
  • Results display can be customized using the searchResultFormatter option

Use Cases​

  • Finding stocks by name or ticker
  • Searching across multiple exchanges simultaneously
  • Finding related instruments (e.g., options chains)
  • Building custom symbol selectors
  • Integration with trading platforms

Limitations​

  • Requires data feed implementation of searchSymbols() method
  • Performance depends on backend API response times
  • No advanced filtering (e.g., by market cap, sector)
  • Limited to symbols supported by connected data feeds

✅ Supported​

  • Symbol name search
  • Exchange filtering
  • Asset type filtering
  • Local caching
  • Async search operations

Feature Classification​

Core Feature - Fundamental functionality required for basic chart operation

Dependencies​

  • Requires backend? Yes (data feed API)
  • Requires storage? Yes (local cache)
  • Requires real-time data? No
  • Requires UI controls? Yes (search input, results dropdown)

Missing Implementation Analysis​

The search functionality is fully implemented and production-ready. All core search capabilities are present in the codebase with proper error handling and caching mechanisms.

Consistency Validation​

The search API follows the same pattern as other API methods with consistent promise-based return values and error handling. Naming conventions are consistent with other features.

UI vs API Separation​

  • UI handles: Search input, results display, autocomplete, loading states
  • API exposes: searchSymbols() method with consistent parameters
  • Must implement manually: Custom data feed search logic for backend integration

User Flow​

  1. User types in search input
  2. Debounce timer starts
  3. Search request sent to active data feed
  4. Results returned and cached
  5. Results displayed in dropdown
  6. User selects result → symbol changes on chart

Integration with Existing Docs​

This feature should be linked from:

  • Charting section → Top Toolbar
  • API Reference → ChartApi
  • Connecting Data → Data Feeds
  • Getting Started → Quick Start Guide