hidenorigoto/index.html

## index.html
<html>
<head>
<link rel="stylesheet" href="joint.css" />
<script src="joint.js"></script>
    <script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
    <script src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
</head>
<body>
<div id="myholder"></div>

<button id="dumpButton" />dump</button>
<textarea id="dump"></textarea>

<script type="text/javascript">
    var graph = new joint.dia.Graph;

    var paper = new joint.dia.Paper({
        el: $('#myholder'),
        width: 1200,
        height: 800,
        model: graph,
        gridSize: 1
    });

    var ubiquitous_language = new joint.shapes.basic.Circle({
        position: { x: 100, y: 500 },
        size: { width: 150, height: 60 },
        attrs: { circle: { fill: 'white', 'stroke-width': 2 }, text: { text: 'UBIQUITOUS\nLANGUAGE', fill: 'black', 'font-weight': 'bold' } }
    });

    var model_driven_design = new joint.shapes.basic.Circle({
        position: { x: 100, y: 400 },
        size: { width: 150, height: 60 },
        attrs: { circle: { fill: 'white', 'stroke-width': 2 }, text: { text: 'MODEL-DRIVEN\nDESIGN', fill: 'black', 'font-weight': 'bold' } }
    });

    var bouded_context = new joint.shapes.basic.Circle({
        position: { x: 300, y: 500 },
        size: { width: 150, height: 60 },
        attrs: { circle: { fill: 'white', 'stroke-width': 2 }, text: { text: 'BOUNDED\nCONTEXT', fill: 'black', 'font-weight': 'bold' } }
    });


    var services = new joint.shapes.basic.Circle({
        position: { x: 100, y: 300 },
        size: { width: 150, height: 60 },
        attrs: { circle: { fill: 'white', 'stroke-width': 2 }, text: { text: 'SERVICES', fill: 'black', 'font-weight': 'bold' } }
    });

    var domain_events = new joint.shapes.basic.Circle({
        position: { x: 300, y: 300 },
        size: { width: 150, height: 60 },
        attrs: { circle: { fill: 'white', 'stroke-width': 2 }, text: { text: 'DOMAIN\nEVENTS', fill: 'black', 'font-weight': 'bold' } }
    });

    var entities = new joint.shapes.basic.Circle({
        position: { x: 500, y: 300 },
        size: { width: 150, height: 60 },
        attrs: { circle: { fill: 'white', 'stroke-width': 2 }, text: { text: 'ENTITIES', fill: 'black', 'font-weight': 'bold' } }
    });

    var value_objects = new joint.shapes.basic.Circle({
        position: { x: 500, y: 400 },
        size: { width: 150, height: 60 },
        attrs: { circle: { fill: 'white', 'stroke-width': 2 }, text: { text: 'VALUE\nOBJECTS', fill: 'black', 'font-weight': 'bold' } }
    });

    var repositories = new joint.shapes.basic.Circle({
        position: { x: 700, y: 300 },
        size: { width: 150, height: 60 },
        attrs: { circle: { fill: 'white', 'stroke-width': 2 }, text: { text: 'REPOSITORIES', fill: 'black', 'font-weight': 'bold' } }
    });

    var aggregates = new joint.shapes.basic.Circle({
        position: { x: 700, y: 400 },
        size: { width: 150, height: 60 },
        attrs: { circle: { fill: 'white', 'stroke-width': 2 }, text: { text: 'AGGREGATES', fill: 'black', 'font-weight': 'bold' } }
    });

    var factories = new joint.shapes.basic.Circle({
        position: { x: 700, y: 500 },
        size: { width: 150, height: 60 },
        attrs: { circle: { fill: 'white', 'stroke-width': 2 }, text: { text: 'FACTORIES', fill: 'black', 'font-weight': 'bold' } }
    });


    var model_driven_design_2_ubiquitous_language = new joint.dia.Link({
        source: { id: model_driven_design.id },
        target: { id: ubiquitous_language.id }
    });

    setLinkStyle(model_driven_design_2_ubiquitous_language, 'model gives structure to');

    var bouded_context_2_ubiquitous_language = new joint.dia.Link({
        source: { id: bouded_context.id },
        target: { id: ubiquitous_language.id }
    });

    setLinkStyle(bouded_context_2_ubiquitous_language, 'names enter');

    var model_driven_design_2_bouded_context = new joint.dia.Link({
        source: { id: model_driven_design.id },
        target: { id: bouded_context.id }
    });

    setLinkStyle(model_driven_design_2_bouded_context, 'degine model within');

    var model_driven_design_2_services = new joint.dia.Link({
        source: { id: model_driven_design.id },
        target: { id: services.id }
    });

    setLinkStyle(model_driven_design_2_services, 'express model with');

    var model_driven_design_2_domain_events = new joint.dia.Link({
        source: { id: model_driven_design.id },
        target: { id: domain_events.id }
    });

    setLinkStyle(model_driven_design_2_domain_events, 'express model with');

    var model_driven_design_2_entities = new joint.dia.Link({
        source: { id: model_driven_design.id },
        target: { id: entities.id }
    });

    setLinkStyle(model_driven_design_2_entities, 'express model with');

    var entities_2_domain_events = new joint.dia.Link({
        source: { id: entities.id },
        target: { id: domain_events.id }
    });

    setLinkStyle(entities_2_domain_events, 'push state change with');

    var model_driven_design_2_value_objects = new joint.dia.Link({
        source: { id: model_driven_design.id },
        target: { id: value_objects.id }
    });

    setLinkStyle(model_driven_design_2_value_objects, 'express model with');

    var entities_2_repositories = new joint.dia.Link({
        source: { id: entities.id },
        target: { id: repositories.id }
    });

    setLinkStyle(entities_2_repositories, 'access with');


    var entities_2_aggregates = new joint.dia.Link({
        source: { id: entities.id },
        target: { id: aggregates.id }
    });

    setLinkStyle(entities_2_aggregates, 'encupsulate with');

    var value_objects_2_aggregates = new joint.dia.Link({
        source: { id: value_objects.id },
        target: { id: aggregates.id }
    });

    setLinkStyle(value_objects_2_aggregates, 'encupsulate with');

    var value_objects_2_factories = new joint.dia.Link({
        source: { id: value_objects.id },
        target: { id: factories.id }
    });

    setLinkStyle(value_objects_2_factories, 'encupsulate with');

    var entities_2_factories = new joint.dia.Link({
        source: { id: entities.id },
        target: { id: factories.id }
    });

    setLinkStyle(entities_2_factories, 'encupsulate with');

    var aggregates_2_repositories = new joint.dia.Link({
        source: { id: aggregates.id },
        target: { id: repositories.id }
    });

    setLinkStyle(aggregates_2_repositories, 'encupsulate with');


    graph.addCells([
        ubiquitous_language, model_driven_design, bouded_context, services, entities,domain_events,value_objects, repositories, aggregates, factories,
        model_driven_design_2_ubiquitous_language, bouded_context_2_ubiquitous_language, model_driven_design_2_bouded_context,
        model_driven_design_2_services, model_driven_design_2_entities,model_driven_design_2_domain_events, model_driven_design_2_value_objects,
        entities_2_domain_events, entities_2_repositories, entities_2_aggregates, aggregates_2_repositories, value_objects_2_aggregates, value_objects_2_factories,
        entities_2_factories
    ]);


    var store = "%7B%22cells%22:%5B%7B%22type%22:%22basic.Circle%22,%22size%22:%7B%22width%22:150,%22height%22:60%7D,%22position%22:%7B%22x%22:178,%22y%22:575%7D,%22angle%22:0,%22id%22:%2297465f2f-abee-43e9-aae4-cd54bf3d95e6%22,%22z%22:1,%22attrs%22:%7B%22circle%22:%7B%22fill%22:%22white%22,%22stroke-width%22:2%7D,%22text%22:%7B%22text%22:%22UBIQUITOUS%5CnLANGUAGE%22,%22font-weight%22:%22bold%22%7D%7D%7D,%7B%22type%22:%22basic.Circle%22,%22size%22:%7B%22width%22:150,%22height%22:60%7D,%22position%22:%7B%22x%22:100,%22y%22:400%7D,%22angle%22:0,%22id%22:%22dac246ca-1aee-4361-9678-8ac91c971000%22,%22z%22:2,%22attrs%22:%7B%22circle%22:%7B%22fill%22:%22white%22,%22stroke-width%22:2%7D,%22text%22:%7B%22text%22:%22MODEL-DRIVEN%5CnDESIGN%22,%22font-weight%22:%22bold%22%7D%7D%7D,%7B%22type%22:%22basic.Circle%22,%22size%22:%7B%22width%22:150,%22height%22:60%7D,%22position%22:%7B%22x%22:420,%22y%22:504%7D,%22angle%22:0,%22id%22:%22258f09d4-016e-475d-afc7-884eaad3dad1%22,%22z%22:3,%22attrs%22:%7B%22circle%22:%7B%22fill%22:%22white%22,%22stroke-width%22:2%7D,%22text%22:%7B%22text%22:%22BOUNDED%5CnCONTEXT%22,%22font-weight%22:%22bold%22%7D%7D%7D,%7B%22type%22:%22basic.Circle%22,%22size%22:%7B%22width%22:150,%22height%22:60%7D,%22position%22:%7B%22x%22:170,%22y%22:169%7D,%22angle%22:0,%22id%22:%22198f9fe0-0df3-47af-8057-ff2b55422a29%22,%22z%22:4,%22attrs%22:%7B%22circle%22:%7B%22fill%22:%22white%22,%22stroke-width%22:2%7D,%22text%22:%7B%22text%22:%22SERVICES%22,%22font-weight%22:%22bold%22%7D%7D%7D,%7B%22type%22:%22basic.Circle%22,%22size%22:%7B%22width%22:150,%22height%22:60%7D,%22position%22:%7B%22x%22:504,%22y%22:234%7D,%22angle%22:0,%22id%22:%22f4b08f08-c4ff-47f9-8454-68b25bfeac80%22,%22z%22:5,%22attrs%22:%7B%22circle%22:%7B%22fill%22:%22white%22,%22stroke-width%22:2%7D,%22text%22:%7B%22text%22:%22ENTITIES%22,%22font-weight%22:%22bold%22%7D%7D%7D,%7B%22type%22:%22basic.Circle%22,%22size%22:%7B%22width%22:150,%22height%22:60%7D,%22position%22:%7B%22x%22:358,%22y%22:128%7D,%22angle%22:0,%22id%22:%22363fcd85-a248-46e0-99b0-2f56707ca05a%22,%22z%22:6,%22attrs%22:%7B%22circle%22:%7B%22fill%22:%22white%22,%22stroke-width%22:2%7D,%22text%22:%7B%22text%22:%22DOMAIN%5CnEVENTS%22,%22font-weight%22:%22bold%22%7D%7D%7D,%7B%22type%22:%22basic.Circle%22,%22size%22:%7B%22width%22:150,%22height%22:60%7D,%22position%22:%7B%22x%22:479,%22y%22:360%7D,%22angle%22:0,%22id%22:%22b78a24bc-514d-4558-97f4-3523c01c2572%22,%22z%22:7,%22attrs%22:%7B%22circle%22:%7B%22fill%22:%22white%22,%22stroke-width%22:2%7D,%22text%22:%7B%22text%22:%22VALUE%5CnOBJECTS%22,%22font-weight%22:%22bold%22%7D%7D%7D,%7B%22type%22:%22basic.Circle%22,%22size%22:%7B%22width%22:150,%22height%22:60%7D,%22position%22:%7B%22x%22:780,%22y%22:141%7D,%22angle%22:0,%22id%22:%227410db9a-4b14-4d42-a5dc-9d5d6f02604d%22,%22z%22:8,%22attrs%22:%7B%22circle%22:%7B%22fill%22:%22white%22,%22stroke-width%22:2%7D,%22text%22:%7B%22text%22:%22REPOSITORIES%22,%22font-weight%22:%22bold%22%7D%7D%7D,%7B%22type%22:%22basic.Circle%22,%22size%22:%7B%22width%22:150,%22height%22:60%7D,%22position%22:%7B%22x%22:803,%22y%22:330%7D,%22angle%22:0,%22id%22:%22bbc5be53-8361-4a9b-90e9-f5c2a9daabca%22,%22z%22:9,%22attrs%22:%7B%22circle%22:%7B%22fill%22:%22white%22,%22stroke-width%22:2%7D,%22text%22:%7B%22text%22:%22AGGREGATES%22,%22font-weight%22:%22bold%22%7D%7D%7D,%7B%22type%22:%22basic.Circle%22,%22size%22:%7B%22width%22:150,%22height%22:60%7D,%22position%22:%7B%22x%22:773,%22y%22:497%7D,%22angle%22:0,%22id%22:%221a9dab37-7541-4465-b302-ac281ddfc189%22,%22z%22:10,%22attrs%22:%7B%22circle%22:%7B%22fill%22:%22white%22,%22stroke-width%22:2%7D,%22text%22:%7B%22text%22:%22FACTORIES%22,%22font-weight%22:%22bold%22%7D%7D%7D,%7B%22type%22:%22link%22,%22source%22:%7B%22id%22:%22dac246ca-1aee-4361-9678-8ac91c971000%22%7D,%22target%22:%7B%22id%22:%2297465f2f-abee-43e9-aae4-cd54bf3d95e6%22%7D,%22id%22:%2231558e4f-7cea-4c6a-8262-a35fa85b18aa%22,%22connector%22:%7B%22name%22:%22smooth%22%7D,%22labels%22:%5B%7B%22position%22:0.5,%22attrs%22:%7B%22rect%22:%7B%22fill%22:%22white%22%7D,%22text%22:%7B%22fill%22:%22grey%22,%22text%22:%22model%20gives%20structure%20to%22%7D%7D%7D%5D,%22z%22:11,%22attrs%22:%7B%22.marker-target%22:%7B%22fill%22:%22grey%22,%22d%22:%22M%2010%200%20L%200%205%20L%2010%2010%20z%22%7D%7D%7D,%7B%22type%22:%22link%22,%22source%22:%7B%22id%22:%22258f09d4-016e-475d-afc7-884eaad3dad1%22%7D,%22target%22:%7B%22id%22:%2297465f2f-abee-43e9-aae4-cd54bf3d95e6%22%7D,%22id%22:%222185809f-1ec3-4d22-811b-0873d775f72a%22,%22connector%22:%7B%22name%22:%22smooth%22%7D,%22labels%22:%5B%7B%22position%22:0.5,%22attrs%22:%7B%22rect%22:%7B%22fill%22:%22white%22%7D,%22text%22:%7B%22fill%22:%22grey%22,%22text%22:%22names%20enter%22%7D%7D%7D%5D,%22z%22:12,%22attrs%22:%7B%22.marker-target%22:%7B%22fill%22:%22grey%22,%22d%22:%22M%2010%200%20L%200%205%20L%2010%2010%20z%22%7D%7D%7D,%7B%22type%22:%22link%22,%22source%22:%7B%22id%22:%22dac246ca-1aee-4361-9678-8ac91c971000%22%7D,%22target%22:%7B%22id%22:%22258f09d4-016e-475d-afc7-884eaad3dad1%22%7D,%22id%22:%22531cd38a-4f35-4ef6-a731-9c5822ef9608%22,%22connector%22:%7B%22name%22:%22smooth%22%7D,%22labels%22:%5B%7B%22position%22:0.5,%22attrs%22:%7B%22rect%22:%7B%22fill%22:%22white%22%7D,%22text%22:%7B%22fill%22:%22grey%22,%22text%22:%22degine%20model%20within%22%7D%7D%7D%5D,%22z%22:13,%22attrs%22:%7B%22.marker-target%22:%7B%22fill%22:%22grey%22,%22d%22:%22M%2010%200%20L%200%205%20L%2010%2010%20z%22%7D%7D%7D,%7B%22type%22:%22link%22,%22source%22:%7B%22id%22:%22dac246ca-1aee-4361-9678-8ac91c971000%22%7D,%22target%22:%7B%22id%22:%22198f9fe0-0df3-47af-8057-ff2b55422a29%22%7D,%22id%22:%2263e2c0b3-d728-4fe9-8ccf-7000668e95a8%22,%22connector%22:%7B%22name%22:%22smooth%22%7D,%22labels%22:%5B%7B%22position%22:0.5,%22attrs%22:%7B%22rect%22:%7B%22fill%22:%22white%22%7D,%22text%22:%7B%22fill%22:%22grey%22,%22text%22:%22express%20model%20with%22%7D%7D%7D%5D,%22z%22:14,%22attrs%22:%7B%22.marker-target%22:%7B%22fill%22:%22grey%22,%22d%22:%22M%2010%200%20L%200%205%20L%2010%2010%20z%22%7D%7D%7D,%7B%22type%22:%22link%22,%22source%22:%7B%22id%22:%22dac246ca-1aee-4361-9678-8ac91c971000%22%7D,%22target%22:%7B%22id%22:%22f4b08f08-c4ff-47f9-8454-68b25bfeac80%22%7D,%22id%22:%22fc846524-e403-419b-8f48-ea763fa3c37f%22,%22connector%22:%7B%22name%22:%22smooth%22%7D,%22labels%22:%5B%7B%22position%22:0.5,%22attrs%22:%7B%22rect%22:%7B%22fill%22:%22white%22%7D,%22text%22:%7B%22fill%22:%22grey%22,%22text%22:%22express%20model%20with%22%7D%7D%7D%5D,%22z%22:15,%22attrs%22:%7B%22.marker-target%22:%7B%22fill%22:%22grey%22,%22d%22:%22M%2010%200%20L%200%205%20L%2010%2010%20z%22%7D%7D%7D,%7B%22type%22:%22link%22,%22source%22:%7B%22id%22:%22dac246ca-1aee-4361-9678-8ac91c971000%22%7D,%22target%22:%7B%22id%22:%22363fcd85-a248-46e0-99b0-2f56707ca05a%22%7D,%22id%22:%229e1f1cd0-8186-4878-b5fe-a6b514a461e9%22,%22connector%22:%7B%22name%22:%22smooth%22%7D,%22labels%22:%5B%7B%22position%22:0.5,%22attrs%22:%7B%22rect%22:%7B%22fill%22:%22white%22%7D,%22text%22:%7B%22fill%22:%22grey%22,%22text%22:%22express%20model%20with%22%7D%7D%7D%5D,%22z%22:16,%22attrs%22:%7B%22.marker-target%22:%7B%22fill%22:%22grey%22,%22d%22:%22M%2010%200%20L%200%205%20L%2010%2010%20z%22%7D%7D%7D,%7B%22type%22:%22link%22,%22source%22:%7B%22id%22:%22dac246ca-1aee-4361-9678-8ac91c971000%22%7D,%22target%22:%7B%22id%22:%22b78a24bc-514d-4558-97f4-3523c01c2572%22%7D,%22id%22:%223833e3bb-35aa-40b6-9ce0-2be2074aba00%22,%22connector%22:%7B%22name%22:%22smooth%22%7D,%22labels%22:%5B%7B%22position%22:0.5,%22attrs%22:%7B%22rect%22:%7B%22fill%22:%22white%22%7D,%22text%22:%7B%22fill%22:%22grey%22,%22text%22:%22express%20model%20with%22%7D%7D%7D%5D,%22z%22:17,%22attrs%22:%7B%22.marker-target%22:%7B%22fill%22:%22grey%22,%22d%22:%22M%2010%200%20L%200%205%20L%2010%2010%20z%22%7D%7D%7D,%7B%22type%22:%22link%22,%22source%22:%7B%22id%22:%22f4b08f08-c4ff-47f9-8454-68b25bfeac80%22%7D,%22target%22:%7B%22id%22:%22363fcd85-a248-46e0-99b0-2f56707ca05a%22%7D,%22id%22:%229d5a4ce5-0927-45aa-986c-9613a0b4fc3f%22,%22connector%22:%7B%22name%22:%22smooth%22%7D,%22labels%22:%5B%7B%22position%22:0.5,%22attrs%22:%7B%22rect%22:%7B%22fill%22:%22white%22%7D,%22text%22:%7B%22fill%22:%22grey%22,%22text%22:%22push%20state%20change%20with%22%7D%7D%7D%5D,%22z%22:18,%22attrs%22:%7B%22.marker-target%22:%7B%22fill%22:%22grey%22,%22d%22:%22M%2010%200%20L%200%205%20L%2010%2010%20z%22%7D%7D%7D,%7B%22type%22:%22link%22,%22source%22:%7B%22id%22:%22f4b08f08-c4ff-47f9-8454-68b25bfeac80%22%7D,%22target%22:%7B%22id%22:%227410db9a-4b14-4d42-a5dc-9d5d6f02604d%22%7D,%22id%22:%226c72213a-78b3-4396-b0a3-40748075b877%22,%22connector%22:%7B%22name%22:%22smooth%22%7D,%22labels%22:%5B%7B%22position%22:0.5,%22attrs%22:%7B%22rect%22:%7B%22fill%22:%22white%22%7D,%22text%22:%7B%22fill%22:%22grey%22,%22text%22:%22access%20with%22%7D%7D%7D%5D,%22z%22:19,%22attrs%22:%7B%22.marker-target%22:%7B%22fill%22:%22grey%22,%22d%22:%22M%2010%200%20L%200%205%20L%2010%2010%20z%22%7D%7D%7D,%7B%22type%22:%22link%22,%22source%22:%7B%22id%22:%22f4b08f08-c4ff-47f9-8454-68b25bfeac80%22%7D,%22target%22:%7B%22id%22:%22bbc5be53-8361-4a9b-90e9-f5c2a9daabca%22%7D,%22id%22:%22cc4b2372-3101-4038-b535-0f023b9aca78%22,%22connector%22:%7B%22name%22:%22smooth%22%7D,%22labels%22:%5B%7B%22position%22:0.5,%22attrs%22:%7B%22rect%22:%7B%22fill%22:%22white%22%7D,%22text%22:%7B%22fill%22:%22grey%22,%22text%22:%22encupsulate%20with%22%7D%7D%7D%5D,%22z%22:20,%22attrs%22:%7B%22.marker-target%22:%7B%22fill%22:%22grey%22,%22d%22:%22M%2010%200%20L%200%205%20L%2010%2010%20z%22%7D%7D%7D,%7B%22type%22:%22link%22,%22source%22:%7B%22id%22:%22bbc5be53-8361-4a9b-90e9-f5c2a9daabca%22%7D,%22target%22:%7B%22id%22:%227410db9a-4b14-4d42-a5dc-9d5d6f02604d%22%7D,%22id%22:%22d8402d8a-8c0f-45e5-938c-80a1c8028e7f%22,%22connector%22:%7B%22name%22:%22smooth%22%7D,%22labels%22:%5B%7B%22position%22:0.5,%22attrs%22:%7B%22rect%22:%7B%22fill%22:%22white%22%7D,%22text%22:%7B%22fill%22:%22grey%22,%22text%22:%22encupsulate%20with%22%7D%7D%7D%5D,%22z%22:21,%22attrs%22:%7B%22.marker-target%22:%7B%22fill%22:%22grey%22,%22d%22:%22M%2010%200%20L%200%205%20L%2010%2010%20z%22%7D%7D%7D,%7B%22type%22:%22link%22,%22source%22:%7B%22id%22:%22b78a24bc-514d-4558-97f4-3523c01c2572%22%7D,%22target%22:%7B%22id%22:%22bbc5be53-8361-4a9b-90e9-f5c2a9daabca%22%7D,%22id%22:%22bb72ef80-ac95-46b3-b725-436f57c92729%22,%22connector%22:%7B%22name%22:%22smooth%22%7D,%22labels%22:%5B%7B%22position%22:0.5,%22attrs%22:%7B%22rect%22:%7B%22fill%22:%22white%22%7D,%22text%22:%7B%22fill%22:%22grey%22,%22text%22:%22encupsulate%20with%22%7D%7D%7D%5D,%22z%22:22,%22attrs%22:%7B%22.marker-target%22:%7B%22fill%22:%22grey%22,%22d%22:%22M%2010%200%20L%200%205%20L%2010%2010%20z%22%7D%7D%7D,%7B%22type%22:%22link%22,%22source%22:%7B%22id%22:%22b78a24bc-514d-4558-97f4-3523c01c2572%22%7D,%22target%22:%7B%22id%22:%221a9dab37-7541-4465-b302-ac281ddfc189%22%7D,%22id%22:%2254253418-87fe-495d-a602-b69dfa64e3e0%22,%22connector%22:%7B%22name%22:%22smooth%22%7D,%22labels%22:%5B%7B%22position%22:0.5,%22attrs%22:%7B%22rect%22:%7B%22fill%22:%22white%22%7D,%22text%22:%7B%22fill%22:%22grey%22,%22text%22:%22encupsulate%20with%22%7D%7D%7D%5D,%22z%22:23,%22attrs%22:%7B%22.marker-target%22:%7B%22fill%22:%22grey%22,%22d%22:%22M%2010%200%20L%200%205%20L%2010%2010%20z%22%7D%7D%7D,%7B%22type%22:%22link%22,%22source%22:%7B%22id%22:%22f4b08f08-c4ff-47f9-8454-68b25bfeac80%22%7D,%22target%22:%7B%22id%22:%221a9dab37-7541-4465-b302-ac281ddfc189%22%7D,%22id%22:%22f5f1e2eb-dd43-4182-a0aa-fa9804bd5f16%22,%22connector%22:%7B%22name%22:%22smooth%22%7D,%22labels%22:%5B%7B%22position%22:0.5,%22attrs%22:%7B%22rect%22:%7B%22fill%22:%22white%22%7D,%22text%22:%7B%22fill%22:%22grey%22,%22text%22:%22encupsulate%20with%22%7D%7D%7D%5D,%22z%22:24,%22attrs%22:%7B%22.marker-target%22:%7B%22fill%22:%22grey%22,%22d%22:%22M%2010%200%20L%200%205%20L%2010%2010%20z%22%7D%7D%7D%5D%7D"


    graph.fromJSON(JSON.parse(decodeURIComponent(store)));

    function setLinkStyle(link, text)
    {
        link.set('connector', { name: 'smooth'});
        link.label(0, {
            position: .5,
            attrs: {
                rect: { fill: 'white' },
                text: { fill: 'grey', text: text }
            }
        });
        link.attr({
            '.marker-target': { fill: 'grey', d: 'M 10 0 L 0 5 L 10 10 z' }
        });
    }

    $('#dumpButton').click(function() {
        $('#dump').val(encodeURI(JSON.stringify(graph)));
    });

</script>
</body>

</html>
	<html>
	<head>
	<link rel="stylesheet" href="joint.css" />
	<script src="joint.js"></script>
	<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
	<script src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
	</head>
	<body>
	<div id="myholder"></div>

	<button id="dumpButton" />dump</button>
	<textarea id="dump"></textarea>

	<script type="text/javascript">
	var graph = new joint.dia.Graph;

	var paper = new joint.dia.Paper({
	el: $('#myholder'),
	width: 1200,
	height: 800,
	model: graph,
	gridSize: 1
	});

	var ubiquitous_language = new joint.shapes.basic.Circle({
	position: { x: 100, y: 500 },
	size: { width: 150, height: 60 },
	attrs: { circle: { fill: 'white', 'stroke-width': 2 }, text: { text: 'UBIQUITOUS\nLANGUAGE', fill: 'black', 'font-weight': 'bold' } }
	});

	var model_driven_design = new joint.shapes.basic.Circle({
	position: { x: 100, y: 400 },
	size: { width: 150, height: 60 },
	attrs: { circle: { fill: 'white', 'stroke-width': 2 }, text: { text: 'MODEL-DRIVEN\nDESIGN', fill: 'black', 'font-weight': 'bold' } }
	});

	var bouded_context = new joint.shapes.basic.Circle({
	position: { x: 300, y: 500 },
	size: { width: 150, height: 60 },
	attrs: { circle: { fill: 'white', 'stroke-width': 2 }, text: { text: 'BOUNDED\nCONTEXT', fill: 'black', 'font-weight': 'bold' } }
	});


	var services = new joint.shapes.basic.Circle({
	position: { x: 100, y: 300 },
	size: { width: 150, height: 60 },
	attrs: { circle: { fill: 'white', 'stroke-width': 2 }, text: { text: 'SERVICES', fill: 'black', 'font-weight': 'bold' } }
	});

	var domain_events = new joint.shapes.basic.Circle({
	position: { x: 300, y: 300 },
	size: { width: 150, height: 60 },
	attrs: { circle: { fill: 'white', 'stroke-width': 2 }, text: { text: 'DOMAIN\nEVENTS', fill: 'black', 'font-weight': 'bold' } }
	});

	var entities = new joint.shapes.basic.Circle({
	position: { x: 500, y: 300 },
	size: { width: 150, height: 60 },
	attrs: { circle: { fill: 'white', 'stroke-width': 2 }, text: { text: 'ENTITIES', fill: 'black', 'font-weight': 'bold' } }
	});

	var value_objects = new joint.shapes.basic.Circle({
	position: { x: 500, y: 400 },
	size: { width: 150, height: 60 },
	attrs: { circle: { fill: 'white', 'stroke-width': 2 }, text: { text: 'VALUE\nOBJECTS', fill: 'black', 'font-weight': 'bold' } }
	});

	var repositories = new joint.shapes.basic.Circle({
	position: { x: 700, y: 300 },
	size: { width: 150, height: 60 },
	attrs: { circle: { fill: 'white', 'stroke-width': 2 }, text: { text: 'REPOSITORIES', fill: 'black', 'font-weight': 'bold' } }
	});

	var aggregates = new joint.shapes.basic.Circle({
	position: { x: 700, y: 400 },
	size: { width: 150, height: 60 },
	attrs: { circle: { fill: 'white', 'stroke-width': 2 }, text: { text: 'AGGREGATES', fill: 'black', 'font-weight': 'bold' } }
	});

	var factories = new joint.shapes.basic.Circle({
	position: { x: 700, y: 500 },
	size: { width: 150, height: 60 },
	attrs: { circle: { fill: 'white', 'stroke-width': 2 }, text: { text: 'FACTORIES', fill: 'black', 'font-weight': 'bold' } }
	});





	var model_driven_design_2_ubiquitous_language = new joint.dia.Link({
	source: { id: model_driven_design.id },
	target: { id: ubiquitous_language.id }
	});

	setLinkStyle(model_driven_design_2_ubiquitous_language, 'model gives structure to');

	var bouded_context_2_ubiquitous_language = new joint.dia.Link({
	source: { id: bouded_context.id },
	target: { id: ubiquitous_language.id }
	});

	setLinkStyle(bouded_context_2_ubiquitous_language, 'names enter');

	var model_driven_design_2_bouded_context = new joint.dia.Link({
	source: { id: model_driven_design.id },
	target: { id: bouded_context.id }
	});

	setLinkStyle(model_driven_design_2_bouded_context, 'degine model within');

	var model_driven_design_2_services = new joint.dia.Link({
	source: { id: model_driven_design.id },
	target: { id: services.id }
	});

	setLinkStyle(model_driven_design_2_services, 'express model with');

	var model_driven_design_2_domain_events = new joint.dia.Link({
	source: { id: model_driven_design.id },
	target: { id: domain_events.id }
	});

	setLinkStyle(model_driven_design_2_domain_events, 'express model with');

	var model_driven_design_2_entities = new joint.dia.Link({
	source: { id: model_driven_design.id },
	target: { id: entities.id }
	});

	setLinkStyle(model_driven_design_2_entities, 'express model with');

	var entities_2_domain_events = new joint.dia.Link({
	source: { id: entities.id },
	target: { id: domain_events.id }
	});

	setLinkStyle(entities_2_domain_events, 'push state change with');

	var model_driven_design_2_value_objects = new joint.dia.Link({
	source: { id: model_driven_design.id },
	target: { id: value_objects.id }
	});

	setLinkStyle(model_driven_design_2_value_objects, 'express model with');

	var entities_2_repositories = new joint.dia.Link({
	source: { id: entities.id },
	target: { id: repositories.id }
	});

	setLinkStyle(entities_2_repositories, 'access with');


	var entities_2_aggregates = new joint.dia.Link({
	source: { id: entities.id },
	target: { id: aggregates.id }
	});

	setLinkStyle(entities_2_aggregates, 'encupsulate with');

	var value_objects_2_aggregates = new joint.dia.Link({
	source: { id: value_objects.id },
	target: { id: aggregates.id }
	});

	setLinkStyle(value_objects_2_aggregates, 'encupsulate with');

	var value_objects_2_factories = new joint.dia.Link({
	source: { id: value_objects.id },
	target: { id: factories.id }
	});

	setLinkStyle(value_objects_2_factories, 'encupsulate with');

	var entities_2_factories = new joint.dia.Link({
	source: { id: entities.id },
	target: { id: factories.id }
	});

	setLinkStyle(entities_2_factories, 'encupsulate with');

	var aggregates_2_repositories = new joint.dia.Link({
	source: { id: aggregates.id },
	target: { id: repositories.id }
	});

	setLinkStyle(aggregates_2_repositories, 'encupsulate with');


	graph.addCells([
	ubiquitous_language, model_driven_design, bouded_context, services, entities,domain_events,value_objects, repositories, aggregates, factories,
	model_driven_design_2_ubiquitous_language, bouded_context_2_ubiquitous_language, model_driven_design_2_bouded_context,
	model_driven_design_2_services, model_driven_design_2_entities,model_driven_design_2_domain_events, model_driven_design_2_value_objects,
	entities_2_domain_events, entities_2_repositories, entities_2_aggregates, aggregates_2_repositories, value_objects_2_aggregates, value_objects_2_factories,
	entities_2_factories
	]);


	var store = "%7B%22cells%22:%5B%7B%22type%22:%22basic.Circle%22,%22size%22:%7B%22width%22:150,%22height%22:60%7D,%22position%22:%7B%22x%22:178,%22y%22:575%7D,%22angle%22:0,%22id%22:%2297465f2f-abee-43e9-aae4-cd54bf3d95e6%22,%22z%22:1,%22attrs%22:%7B%22circle%22:%7B%22fill%22:%22white%22,%22stroke-width%22:2%7D,%22text%22:%7B%22text%22:%22UBIQUITOUS%5CnLANGUAGE%22,%22font-weight%22:%22bold%22%7D%7D%7D,%7B%22type%22:%22basic.Circle%22,%22size%22:%7B%22width%22:150,%22height%22:60%7D,%22position%22:%7B%22x%22:100,%22y%22:400%7D,%22angle%22:0,%22id%22:%22dac246ca-1aee-4361-9678-8ac91c971000%22,%22z%22:2,%22attrs%22:%7B%22circle%22:%7B%22fill%22:%22white%22,%22stroke-width%22:2%7D,%22text%22:%7B%22text%22:%22MODEL-DRIVEN%5CnDESIGN%22,%22font-weight%22:%22bold%22%7D%7D%7D,%7B%22type%22:%22basic.Circle%22,%22size%22:%7B%22width%22:150,%22height%22:60%7D,%22position%22:%7B%22x%22:420,%22y%22:504%7D,%22angle%22:0,%22id%22:%22258f09d4-016e-475d-afc7-884eaad3dad1%22,%22z%22:3,%22attrs%22:%7B%22circle%22:%7B%22fill%22:%22white%22,%22stroke-width%22:2%7D,%22text%22:%7B%22text%22:%22BOUNDED%5CnCONTEXT%22,%22font-weight%22:%22bold%22%7D%7D%7D,%7B%22type%22:%22basic.Circle%22,%22size%22:%7B%22width%22:150,%22height%22:60%7D,%22position%22:%7B%22x%22:170,%22y%22:169%7D,%22angle%22:0,%22id%22:%22198f9fe0-0df3-47af-8057-ff2b55422a29%22,%22z%22:4,%22attrs%22:%7B%22circle%22:%7B%22fill%22:%22white%22,%22stroke-width%22:2%7D,%22text%22:%7B%22text%22:%22SERVICES%22,%22font-weight%22:%22bold%22%7D%7D%7D,%7B%22type%22:%22basic.Circle%22,%22size%22:%7B%22width%22:150,%22height%22:60%7D,%22position%22:%7B%22x%22:504,%22y%22:234%7D,%22angle%22:0,%22id%22:%22f4b08f08-c4ff-47f9-8454-68b25bfeac80%22,%22z%22:5,%22attrs%22:%7B%22circle%22:%7B%22fill%22:%22white%22,%22stroke-width%22:2%7D,%22text%22:%7B%22text%22:%22ENTITIES%22,%22font-weight%22:%22bold%22%7D%7D%7D,%7B%22type%22:%22basic.Circle%22,%22size%22:%7B%22width%22:150,%22height%22:60%7D,%22position%22:%7B%22x%22:358,%22y%22:128%7D,%22angle%22:0,%22id%22:%22363fcd85-a248-46e0-99b0-2f56707ca05a%22,%22z%22:6,%22attrs%22:%7B%22circle%22:%7B%22fill%22:%22white%22,%22stroke-width%22:2%7D,%22text%22:%7B%22text%22:%22DOMAIN%5CnEVENTS%22,%22font-weight%22:%22bold%22%7D%7D%7D,%7B%22type%22:%22basic.Circle%22,%22size%22:%7B%22width%22:150,%22height%22:60%7D,%22position%22:%7B%22x%22:479,%22y%22:360%7D,%22angle%22:0,%22id%22:%22b78a24bc-514d-4558-97f4-3523c01c2572%22,%22z%22:7,%22attrs%22:%7B%22circle%22:%7B%22fill%22:%22white%22,%22stroke-width%22:2%7D,%22text%22:%7B%22text%22:%22VALUE%5CnOBJECTS%22,%22font-weight%22:%22bold%22%7D%7D%7D,%7B%22type%22:%22basic.Circle%22,%22size%22:%7B%22width%22:150,%22height%22:60%7D,%22position%22:%7B%22x%22:780,%22y%22:141%7D,%22angle%22:0,%22id%22:%227410db9a-4b14-4d42-a5dc-9d5d6f02604d%22,%22z%22:8,%22attrs%22:%7B%22circle%22:%7B%22fill%22:%22white%22,%22stroke-width%22:2%7D,%22text%22:%7B%22text%22:%22REPOSITORIES%22,%22font-weight%22:%22bold%22%7D%7D%7D,%7B%22type%22:%22basic.Circle%22,%22size%22:%7B%22width%22:150,%22height%22:60%7D,%22position%22:%7B%22x%22:803,%22y%22:330%7D,%22angle%22:0,%22id%22:%22bbc5be53-8361-4a9b-90e9-f5c2a9daabca%22,%22z%22:9,%22attrs%22:%7B%22circle%22:%7B%22fill%22:%22white%22,%22stroke-width%22:2%7D,%22text%22:%7B%22text%22:%22AGGREGATES%22,%22font-weight%22:%22bold%22%7D%7D%7D,%7B%22type%22:%22basic.Circle%22,%22size%22:%7B%22width%22:150,%22height%22:60%7D,%22position%22:%7B%22x%22:773,%22y%22:497%7D,%22angle%22:0,%22id%22:%221a9dab37-7541-4465-b302-ac281ddfc189%22,%22z%22:10,%22attrs%22:%7B%22circle%22:%7B%22fill%22:%22white%22,%22stroke-width%22:2%7D,%22text%22:%7B%22text%22:%22FACTORIES%22,%22font-weight%22:%22bold%22%7D%7D%7D,%7B%22type%22:%22link%22,%22source%22:%7B%22id%22:%22dac246ca-1aee-4361-9678-8ac91c971000%22%7D,%22target%22:%7B%22id%22:%2297465f2f-abee-43e9-aae4-cd54bf3d95e6%22%7D,%22id%22:%2231558e4f-7cea-4c6a-8262-a35fa85b18aa%22,%22connector%22:%7B%22name%22:%22smooth%22%7D,%22labels%22:%5B%7B%22position%22:0.5,%22attrs%22:%7B%22rect%22:%7B%22fill%22:%22white%22%7D,%22text%22:%7B%22fill%22:%22grey%22,%22text%22:%22model%20gives%20structure%20to%22%7D%7D%7D%5D,%22z%22:11,%22attrs%22:%7B%22.marker-target%22:%7B%22fill%22:%22grey%22,%22d%22:%22M%2010%200%20L%200%205%20L%2010%2010%20z%22%7D%7D%7D,%7B%22type%22:%22link%22,%22source%22:%7B%22id%22:%22258f09d4-016e-475d-afc7-884eaad3dad1%22%7D,%22target%22:%7B%22id%22:%2297465f2f-abee-43e9-aae4-cd54bf3d95e6%22%7D,%22id%22:%222185809f-1ec3-4d22-811b-0873d775f72a%22,%22connector%22:%7B%22name%22:%22smooth%22%7D,%22labels%22:%5B%7B%22position%22:0.5,%22attrs%22:%7B%22rect%22:%7B%22fill%22:%22white%22%7D,%22text%22:%7B%22fill%22:%22grey%22,%22text%22:%22names%20enter%22%7D%7D%7D%5D,%22z%22:12,%22attrs%22:%7B%22.marker-target%22:%7B%22fill%22:%22grey%22,%22d%22:%22M%2010%200%20L%200%205%20L%2010%2010%20z%22%7D%7D%7D,%7B%22type%22:%22link%22,%22source%22:%7B%22id%22:%22dac246ca-1aee-4361-9678-8ac91c971000%22%7D,%22target%22:%7B%22id%22:%22258f09d4-016e-475d-afc7-884eaad3dad1%22%7D,%22id%22:%22531cd38a-4f35-4ef6-a731-9c5822ef9608%22,%22connector%22:%7B%22name%22:%22smooth%22%7D,%22labels%22:%5B%7B%22position%22:0.5,%22attrs%22:%7B%22rect%22:%7B%22fill%22:%22white%22%7D,%22text%22:%7B%22fill%22:%22grey%22,%22text%22:%22degine%20model%20within%22%7D%7D%7D%5D,%22z%22:13,%22attrs%22:%7B%22.marker-target%22:%7B%22fill%22:%22grey%22,%22d%22:%22M%2010%200%20L%200%205%20L%2010%2010%20z%22%7D%7D%7D,%7B%22type%22:%22link%22,%22source%22:%7B%22id%22:%22dac246ca-1aee-4361-9678-8ac91c971000%22%7D,%22target%22:%7B%22id%22:%22198f9fe0-0df3-47af-8057-ff2b55422a29%22%7D,%22id%22:%2263e2c0b3-d728-4fe9-8ccf-7000668e95a8%22,%22connector%22:%7B%22name%22:%22smooth%22%7D,%22labels%22:%5B%7B%22position%22:0.5,%22attrs%22:%7B%22rect%22:%7B%22fill%22:%22white%22%7D,%22text%22:%7B%22fill%22:%22grey%22,%22text%22:%22express%20model%20with%22%7D%7D%7D%5D,%22z%22:14,%22attrs%22:%7B%22.marker-target%22:%7B%22fill%22:%22grey%22,%22d%22:%22M%2010%200%20L%200%205%20L%2010%2010%20z%22%7D%7D%7D,%7B%22type%22:%22link%22,%22source%22:%7B%22id%22:%22dac246ca-1aee-4361-9678-8ac91c971000%22%7D,%22target%22:%7B%22id%22:%22f4b08f08-c4ff-47f9-8454-68b25bfeac80%22%7D,%22id%22:%22fc846524-e403-419b-8f48-ea763fa3c37f%22,%22connector%22:%7B%22name%22:%22smooth%22%7D,%22labels%22:%5B%7B%22position%22:0.5,%22attrs%22:%7B%22rect%22:%7B%22fill%22:%22white%22%7D,%22text%22:%7B%22fill%22:%22grey%22,%22text%22:%22express%20model%20with%22%7D%7D%7D%5D,%22z%22:15,%22attrs%22:%7B%22.marker-target%22:%7B%22fill%22:%22grey%22,%22d%22:%22M%2010%200%20L%200%205%20L%2010%2010%20z%22%7D%7D%7D,%7B%22type%22:%22link%22,%22source%22:%7B%22id%22:%22dac246ca-1aee-4361-9678-8ac91c971000%22%7D,%22target%22:%7B%22id%22:%22363fcd85-a248-46e0-99b0-2f56707ca05a%22%7D,%22id%22:%229e1f1cd0-8186-4878-b5fe-a6b514a461e9%22,%22connector%22:%7B%22name%22:%22smooth%22%7D,%22labels%22:%5B%7B%22position%22:0.5,%22attrs%22:%7B%22rect%22:%7B%22fill%22:%22white%22%7D,%22text%22:%7B%22fill%22:%22grey%22,%22text%22:%22express%20model%20with%22%7D%7D%7D%5D,%22z%22:16,%22attrs%22:%7B%22.marker-target%22:%7B%22fill%22:%22grey%22,%22d%22:%22M%2010%200%20L%200%205%20L%2010%2010%20z%22%7D%7D%7D,%7B%22type%22:%22link%22,%22source%22:%7B%22id%22:%22dac246ca-1aee-4361-9678-8ac91c971000%22%7D,%22target%22:%7B%22id%22:%22b78a24bc-514d-4558-97f4-3523c01c2572%22%7D,%22id%22:%223833e3bb-35aa-40b6-9ce0-2be2074aba00%22,%22connector%22:%7B%22name%22:%22smooth%22%7D,%22labels%22:%5B%7B%22position%22:0.5,%22attrs%22:%7B%22rect%22:%7B%22fill%22:%22white%22%7D,%22text%22:%7B%22fill%22:%22grey%22,%22text%22:%22express%20model%20with%22%7D%7D%7D%5D,%22z%22:17,%22attrs%22:%7B%22.marker-target%22:%7B%22fill%22:%22grey%22,%22d%22:%22M%2010%200%20L%200%205%20L%2010%2010%20z%22%7D%7D%7D,%7B%22type%22:%22link%22,%22source%22:%7B%22id%22:%22f4b08f08-c4ff-47f9-8454-68b25bfeac80%22%7D,%22target%22:%7B%22id%22:%22363fcd85-a248-46e0-99b0-2f56707ca05a%22%7D,%22id%22:%229d5a4ce5-0927-45aa-986c-9613a0b4fc3f%22,%22connector%22:%7B%22name%22:%22smooth%22%7D,%22labels%22:%5B%7B%22position%22:0.5,%22attrs%22:%7B%22rect%22:%7B%22fill%22:%22white%22%7D,%22text%22:%7B%22fill%22:%22grey%22,%22text%22:%22push%20state%20change%20with%22%7D%7D%7D%5D,%22z%22:18,%22attrs%22:%7B%22.marker-target%22:%7B%22fill%22:%22grey%22,%22d%22:%22M%2010%200%20L%200%205%20L%2010%2010%20z%22%7D%7D%7D,%7B%22type%22:%22link%22,%22source%22:%7B%22id%22:%22f4b08f08-c4ff-47f9-8454-68b25bfeac80%22%7D,%22target%22:%7B%22id%22:%227410db9a-4b14-4d42-a5dc-9d5d6f02604d%22%7D,%22id%22:%226c72213a-78b3-4396-b0a3-40748075b877%22,%22connector%22:%7B%22name%22:%22smooth%22%7D,%22labels%22:%5B%7B%22position%22:0.5,%22attrs%22:%7B%22rect%22:%7B%22fill%22:%22white%22%7D,%22text%22:%7B%22fill%22:%22grey%22,%22text%22:%22access%20with%22%7D%7D%7D%5D,%22z%22:19,%22attrs%22:%7B%22.marker-target%22:%7B%22fill%22:%22grey%22,%22d%22:%22M%2010%200%20L%200%205%20L%2010%2010%20z%22%7D%7D%7D,%7B%22type%22:%22link%22,%22source%22:%7B%22id%22:%22f4b08f08-c4ff-47f9-8454-68b25bfeac80%22%7D,%22target%22:%7B%22id%22:%22bbc5be53-8361-4a9b-90e9-f5c2a9daabca%22%7D,%22id%22:%22cc4b2372-3101-4038-b535-0f023b9aca78%22,%22connector%22:%7B%22name%22:%22smooth%22%7D,%22labels%22:%5B%7B%22position%22:0.5,%22attrs%22:%7B%22rect%22:%7B%22fill%22:%22white%22%7D,%22text%22:%7B%22fill%22:%22grey%22,%22text%22:%22encupsulate%20with%22%7D%7D%7D%5D,%22z%22:20,%22attrs%22:%7B%22.marker-target%22:%7B%22fill%22:%22grey%22,%22d%22:%22M%2010%200%20L%200%205%20L%2010%2010%20z%22%7D%7D%7D,%7B%22type%22:%22link%22,%22source%22:%7B%22id%22:%22bbc5be53-8361-4a9b-90e9-f5c2a9daabca%22%7D,%22target%22:%7B%22id%22:%227410db9a-4b14-4d42-a5dc-9d5d6f02604d%22%7D,%22id%22:%22d8402d8a-8c0f-45e5-938c-80a1c8028e7f%22,%22connector%22:%7B%22name%22:%22smooth%22%7D,%22labels%22:%5B%7B%22position%22:0.5,%22attrs%22:%7B%22rect%22:%7B%22fill%22:%22white%22%7D,%22text%22:%7B%22fill%22:%22grey%22,%22text%22:%22encupsulate%20with%22%7D%7D%7D%5D,%22z%22:21,%22attrs%22:%7B%22.marker-target%22:%7B%22fill%22:%22grey%22,%22d%22:%22M%2010%200%20L%200%205%20L%2010%2010%20z%22%7D%7D%7D,%7B%22type%22:%22link%22,%22source%22:%7B%22id%22:%22b78a24bc-514d-4558-97f4-3523c01c2572%22%7D,%22target%22:%7B%22id%22:%22bbc5be53-8361-4a9b-90e9-f5c2a9daabca%22%7D,%22id%22:%22bb72ef80-ac95-46b3-b725-436f57c92729%22,%22connector%22:%7B%22name%22:%22smooth%22%7D,%22labels%22:%5B%7B%22position%22:0.5,%22attrs%22:%7B%22rect%22:%7B%22fill%22:%22white%22%7D,%22text%22:%7B%22fill%22:%22grey%22,%22text%22:%22encupsulate%20with%22%7D%7D%7D%5D,%22z%22:22,%22attrs%22:%7B%22.marker-target%22:%7B%22fill%22:%22grey%22,%22d%22:%22M%2010%200%20L%200%205%20L%2010%2010%20z%22%7D%7D%7D,%7B%22type%22:%22link%22,%22source%22:%7B%22id%22:%22b78a24bc-514d-4558-97f4-3523c01c2572%22%7D,%22target%22:%7B%22id%22:%221a9dab37-7541-4465-b302-ac281ddfc189%22%7D,%22id%22:%2254253418-87fe-495d-a602-b69dfa64e3e0%22,%22connector%22:%7B%22name%22:%22smooth%22%7D,%22labels%22:%5B%7B%22position%22:0.5,%22attrs%22:%7B%22rect%22:%7B%22fill%22:%22white%22%7D,%22text%22:%7B%22fill%22:%22grey%22,%22text%22:%22encupsulate%20with%22%7D%7D%7D%5D,%22z%22:23,%22attrs%22:%7B%22.marker-target%22:%7B%22fill%22:%22grey%22,%22d%22:%22M%2010%200%20L%200%205%20L%2010%2010%20z%22%7D%7D%7D,%7B%22type%22:%22link%22,%22source%22:%7B%22id%22:%22f4b08f08-c4ff-47f9-8454-68b25bfeac80%22%7D,%22target%22:%7B%22id%22:%221a9dab37-7541-4465-b302-ac281ddfc189%22%7D,%22id%22:%22f5f1e2eb-dd43-4182-a0aa-fa9804bd5f16%22,%22connector%22:%7B%22name%22:%22smooth%22%7D,%22labels%22:%5B%7B%22position%22:0.5,%22attrs%22:%7B%22rect%22:%7B%22fill%22:%22white%22%7D,%22text%22:%7B%22fill%22:%22grey%22,%22text%22:%22encupsulate%20with%22%7D%7D%7D%5D,%22z%22:24,%22attrs%22:%7B%22.marker-target%22:%7B%22fill%22:%22grey%22,%22d%22:%22M%2010%200%20L%200%205%20L%2010%2010%20z%22%7D%7D%7D%5D%7D"


	graph.fromJSON(JSON.parse(decodeURIComponent(store)));

	function setLinkStyle(link, text)
	{
	link.set('connector', { name: 'smooth'});
	link.label(0, {
	position: .5,
	attrs: {
	rect: { fill: 'white' },
	text: { fill: 'grey', text: text }
	}
	});
	link.attr({
	'.marker-target': { fill: 'grey', d: 'M 10 0 L 0 5 L 10 10 z' }
	});
	}

	$('#dumpButton').click(function() {
	$('#dump').val(encodeURI(JSON.stringify(graph)));
	});

	</script>
	</body>

	</html>