const section = generateMindmapSection({
topic: 'Cybersecurity Policy',
lang: 'en',
centralThesis: 'Parliamentary focus on cybersecurity spans defensive legislation and EU alignment.',
branches: [
{
label: 'Key Actors',
color: 'cyan',
icon: '👥',
dimension: 'power',
aiItems: [
{ text: 'Ministry of Defence', weight: 'critical' },
{ text: 'NCSC', weight: 'significant' },
],
subBranches: [
{ label: 'Government', items: ['Policy initiative', 'Regulatory mandate'] },
{ label: 'Opposition', items: ['Oversight function', 'Amendment proposals'] },
],
},
],
});
articleData.sections = [...(articleData.sections ?? []), section];
Generate a color-coded mindmap section.
Returns a
TemplateSection(pure HTML/CSS — no JavaScript) that can be appended toArticleData.sections. The mindmap renders a central topic node surrounded by colored branch nodes, each optionally containing child items, AI-weighted items, and stakeholder sub-branches.Supports AI-driven conceptual mapping features:
centralThesis— AI-synthesized statement in the center nodeconnections— Cross-branch connection indicatorsMindmapBranch.aiItems— Weighted items withdata-weightattributeMindmapBranch.subBranches— Stakeholder sub-branches (hierarchical depth)The CSS for
.mindmap-sectionlives instyles/components/mindmap.css(imported bystyles.css). No client-side JS is required or loaded.