<!– Cytoscape.js CDN –>
<!– Kontener mapy –>
<div id=”cy” style=”width: 100%; height: 600px; border: 1px solid #ccc;”></div>
<script>
var cy = cytoscape({
container: document.getElementById(’cy’),
elements: [
{ data: { id: 'k1′, label: '1. Kultura adrenalinowa vs dopaminowa’ }},
{ data: { id: 'k2′, label: '2. Kultura osobista’ }},
{ data: { id: 'k3′, label: '3. Kultura zespołowa’ }},
{ data: { id: 'k4′, label: '4. 3iM – Inżynieria Intelektualna i Mentalna’ }},
{ data: { id: 'k5′, label: '5. Reflexio 2025′ }},
{ data: { id: 'k6′, label: '6. Reflexio jako kompetencje’ }},
{ data: { id: 'k7′, label: '7. Obszary dodatkowe’ }},
// Połączenia
{ data: { source: 'k1′, target: 'k2′ }},
{ data: { source: 'k2′, target: 'k3′ }},
{ data: { source: 'k3′, target: 'k4′ }},
{ data: { source: 'k4′, target: 'k5′ }},
{ data: { source: 'k5′, target: 'k6′ }},
{ data: { source: 'k6′, target: 'k7′ }}
],
style: [
{
selector: 'node’,
style: {
'content’: 'data(label)’,
'text-valign’: 'center’,
'color’: '#000′,
'background-color’: '#7FC8A9′,
'text-outline-width’: 1,
'text-outline-color’: '#fff’,
'font-size’: 12
}
},
{
selector: 'edge’,
style: {
'width’: 2,
'line-color’: '#999′,
'target-arrow-color’: '#999′,
'target-arrow-shape’: 'triangle’
}
}
],
layout: {
name: 'breadthfirst’,
directed: true,
padding: 10
}
});
</script>