Skip to main content
Glama

create_sparkline

Generate compact ASCII sparklines for numeric data, ideal for inline terminal visualizations. Customize width, add titles, and apply ANSI colors to highlight trends or metrics directly in text-based environments.

Instructions

Generate compact ASCII sparklines for inline charts

Input Schema

TableJSON Schema
NameRequiredDescriptionDefault
colorNoANSI color name
dataYesArray of numeric values to plot
titleNoOptional sparkline title
widthNoSparkline width (10-100, default: 40)

Implementation Reference

  • The primary handler function implementing the sparkline generation logic, processing data into ASCII art with optional min/max labels, coloring, and title centering.
    export function createSparkline(data: ChartData, options: SparklineOptions = {}): ChartResult { const { data: values, title, width = 40, color = 'white' } = data; const { showMinMax = true, fillChar } = options; if (values.length === 0) { throw new Error('Data array cannot be empty'); } const minValue = Math.min(...values); const maxValue = Math.max(...values); const valueRange = maxValue - minValue; // Calculate sparkline width (reserve space for min/max if shown) const sparklineWidth = showMinMax ? width - 20 : width; let sparkline = ''; // Generate sparkline using block characters if (fillChar) { // Use custom fill character for (let i = 0; i < Math.min(values.length, sparklineWidth); i++) { sparkline += fillChar; } } else { // Use gradient block characters const blocks = ASCII_CHARS.sparkBlocks; for (let i = 0; i < Math.min(values.length, sparklineWidth); i++) { const normalizedValue = valueRange === 0 ? 0.5 : normalize(values[i], minValue, maxValue); const blockIndex = Math.floor(normalizedValue * (blocks.length - 1)); sparkline += blocks[blockIndex]; } } // Add min/max values if requested if (showMinMax) { const minStr = minValue.toFixed(1); const maxStr = maxValue.toFixed(1); sparkline = `${minStr} ${sparkline} ${maxStr}`; } // Apply coloring if (color !== 'white') { sparkline = colorize(sparkline, color); } // Add title if provided let result = sparkline; if (title) { const titleLine = center(title, sparkline.length); result = titleLine + '\n' + sparkline; } return { chart: result, title, dimensions: { width: sparkline.length, height: title ? 2 : 1 } }; }
  • src/index.ts:237-269 (registration)
    Tool registration in the MCP ListTools handler, defining name, description, and input schema for create_sparkline.
    { name: 'create_sparkline', description: 'Generate compact ASCII sparklines for inline charts', inputSchema: { type: 'object', properties: { data: { type: 'array', items: { type: 'number' }, description: 'Array of numeric values to plot' }, title: { type: 'string', description: 'Optional sparkline title', optional: true }, width: { type: 'number', description: 'Sparkline width (10-100, default: 40)', minimum: 10, maximum: 100, optional: true }, color: { type: 'string', description: 'ANSI color name', optional: true } }, required: ['data'], examples: getToolExamples('create_sparkline') } }
  • TypeScript interface defining optional parameters for sparkline customization (showMinMax, fillChar).
    export interface SparklineOptions { showMinMax?: boolean; fillChar?: string; }
  • src/index.ts:377-384 (registration)
    Dispatch handler in the generateChart switch statement that calls the createSparkline function for the 'create_sparkline' tool.
    case 'create_sparkline': { progress.nextStep('Generating sparkline'); result = await withRequestTracking( () => Promise.resolve(createSparkline(chartData)), 'create_sparkline' )(); break; }
  • Example input parameters for the create_sparkline tool, used in tool registration.
    create_sparkline: { compact: { data: [1, 3, 2, 5, 4, 7, 6, 8], title: "Quick Trend" }, metrics: { data: [23, 25, 22, 28, 30, 27, 31, 29, 33], title: "System Load", color: "red", width: 30 }, inline: { data: [100, 102, 98, 105, 110, 108, 112], width: 25 } }

Other Tools

Related Tools

Latest Blog Posts

MCP directory API

We provide all the information about MCP servers via our MCP API.

curl -X GET 'https://glama.ai/api/mcp/v1/servers/gianlucamazza/mcp-ascii-charts'

If you have feedback or need assistance with the MCP directory API, please join our Discord server