Skip to main content
Glama

generate_network_graph

Create visual network graphs to map relationships between entities (nodes) with customizable styles, themes, and dimensions for clear data representation. Belongs to MCP Server Chart.

Instructions

Generate a network graph chart to show relationships (edges) between entities (nodes), such as, relationships between people in social networks.

Input Schema

TableJSON Schema
NameRequiredDescriptionDefault
dataYesData for network graph chart, such as, { nodes: [{ name: 'node1' }, { name: 'node2' }], edges: [{ source: 'node1', target: 'node2', name: 'edge1' }] }
heightNoSet the height of chart, default is 400.
styleNoCustom style configuration for the chart.
themeNoSet the theme for the chart, optional, default is 'default'.default
widthNoSet the width of chart, default is 600.

Implementation Reference

  • Handler function that executes the generate_network_graph tool by mapping to chart type 'network-graph', validating input with schema, and generating a chart URL via generateChartUrl.
    export async function callTool(tool: string, args: object = {}) { logger.info(`Calling tool: ${tool}`); const chartType = CHART_TYPE_MAP[tool as keyof typeof CHART_TYPE_MAP]; if (!chartType) { logger.error(`Unknown tool: ${tool}`); throw new McpError(ErrorCode.MethodNotFound, `Unknown tool: ${tool}.`); } try { // Validate input using Zod before sending to API. // Select the appropriate schema based on the chart type. const schema = Charts[chartType].schema; if (schema) { // Use safeParse instead of parse and try-catch. const result = z.object(schema).safeParse(args); if (!result.success) { logger.error(`Invalid parameters: ${result.error.message}`); throw new McpError( ErrorCode.InvalidParams, `Invalid parameters: ${result.error.message}`, ); } } const isMapChartTool = [ "generate_district_map", "generate_path_map", "generate_pin_map", ].includes(tool); if (isMapChartTool) { // For map charts, we use the generateMap function, and return the mcp result. const { metadata, ...result } = await generateMap(tool, args); return result; } const url = await generateChartUrl(chartType, args); logger.info(`Generated chart URL: ${url}`); return { content: [ { type: "text", text: url, }, ], _meta: { description: "This is the chart's spec and configuration, which can be renderred to corresponding chart by AntV GPT-Vis chart components.", spec: { type: chartType, ...args }, }, }; // biome-ignore lint/suspicious/noExplicitAny: <explanation> } catch (error: any) { logger.error( `Failed to generate chart: ${error.message || "Unknown error"}.`, ); if (error instanceof McpError) throw error; if (error instanceof ValidateError) throw new McpError(ErrorCode.InvalidParams, error.message); throw new McpError( ErrorCode.InternalError, `Failed to generate chart: ${error?.message || "Unknown error."}`, ); } }
  • Defines the input schema, tool descriptor (name, description, inputSchema), and exports for the generate_network_graph tool.
    // Network graph input schema const schema = { data: z .object({ nodes: z .array(NodeSchema) .nonempty({ message: "At least one node is required." }), edges: z.array(EdgeSchema), }) .describe( "Data for network graph chart, such as, { nodes: [{ name: 'node1' }, { name: 'node2' }], edges: [{ source: 'node1', target: 'node2', name: 'edge1' }] }", ) .refine(validatedNodeEdgeDataSchema, { message: "Invalid parameters", path: ["data", "edges"], }), style: z .object({ texture: TextureSchema, }) .optional() .describe( "Style configuration for the chart with a JSON object, optional.", ), theme: ThemeSchema, width: WidthSchema, height: HeightSchema, }; // Network graph tool descriptor const tool = { name: "generate_network_graph", description: "Generate a network graph chart to show relationships (edges) between entities (nodes), such as, relationships between people in social networks.", inputSchema: zodToJsonSchema(schema), }; export const networkGraph = { schema, tool, };
  • src/server.ts:64-77 (registration)
    Registers all chart tools, including generate_network_graph, by setting MCP request handlers for listTools (listing tool descriptors from Charts.*.tool) and callTool (delegating to utils/callTool).
    function setupToolHandlers(server: Server): void { logger.info("setting up tool handlers..."); server.setRequestHandler(ListToolsRequestSchema, async () => ({ tools: getEnabledTools().map((chart) => chart.tool), })); // biome-ignore lint/suspicious/noExplicitAny: <explanation> server.setRequestHandler(CallToolRequestSchema, async (request: any) => { logger.info("calling tool", request.params.name, request.params.arguments); return await callTool(request.params.name, request.params.arguments); }); logger.info("tool handlers set up"); }
  • CHART_TYPE_MAP that maps 'generate_network_graph' to internal chart type 'network-graph' used for schema lookup and URL generation.
    const CHART_TYPE_MAP = { generate_area_chart: "area", generate_bar_chart: "bar", generate_boxplot_chart: "boxplot", generate_column_chart: "column", generate_district_map: "district-map", generate_dual_axes_chart: "dual-axes", generate_fishbone_diagram: "fishbone-diagram", generate_flow_diagram: "flow-diagram", generate_funnel_chart: "funnel", generate_histogram_chart: "histogram", generate_line_chart: "line", generate_liquid_chart: "liquid", generate_mind_map: "mind-map", generate_network_graph: "network-graph", generate_organization_chart: "organization-chart", generate_path_map: "path-map", generate_pie_chart: "pie", generate_pin_map: "pin-map", generate_radar_chart: "radar", generate_sankey_chart: "sankey", generate_scatter_chart: "scatter", generate_treemap_chart: "treemap", generate_venn_chart: "venn", generate_violin_chart: "violin", generate_word_cloud_chart: "word-cloud", } as const;
  • generateChartUrl function called by handler to POST chart spec to external visualization service and return the rendered chart URL.
    export async function generateChartUrl( type: string, // biome-ignore lint/suspicious/noExplicitAny: <explanation> options: Record<string, any>, ): Promise<string> { const url = getVisRequestServer(); const response = await axios.post( url, { type, ...options, source: "mcp-server-chart", }, { headers: { "Content-Type": "application/json", }, }, ); const { success, errorMessage, resultObj } = response.data; if (!success) { throw new Error(errorMessage); } return resultObj; }

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/antvis/mcp-server-chart'

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