PageSourceSearch

https://dagitty.net/dags.html

html dagitty.net collected 2026-10-02 03:34:16 UTC 19,312 bytes, 419 lines download raw bytes

1<!DOCTYPE html>
2<html lang="en">
3    <head>
4    <meta http-equiv="Content-type" content="text/html; charset=UTF-8" />
5    <!--
6        DAGitty - a graphical tool for analyzing causal diagrams
7        Copyright (C) 2010-2023 Johannes Textor, Benito van der Zander
8    
9        This program is free software; you can redistribute it and/or
10        modify it under the terms of the GNU General Public License
11        as published by the Free Software Foundation; either version 2
12        of the License, or (at your option) any later version.
13    
14        This program is distributed in the hope that it will be useful,
15        but WITHOUT ANY WARRANTY; without even the implied warranty of
16        MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
17        GNU General Public License for more details.
18    
19        You should have received a copy of the GNU General Public License
20        along with this program; if not, write to the Free Software
21        Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.   
22    -->
23
24    <title>DAGitty v3.1</title>
25    <link rel="stylesheet" type="text/css" href="dags.css" />
26
27    
27<script src="js/dagitty.js"></script>
27
28    
28<script src="js/example-dags.js"></script>
28
29
30    
30<script src="js/styles/semlike.js"></script>
30
31    
31<script src="js/styles/original.js"></script>
31
32
33    
33<script src="js/main.js?v=2023-12-13"></script>
33
34    
34<script src="js/base64.js"></script>
34
35    
36    <meta name="viewport" content="width=device-width, initial-scale=1" />
37
38    
38<script>
39    var redraw;
40    var renderer;
41    var layouter;
42    var height = 300;
43    var width = 600;
44    var mouse_on_canvas;
45    var resize_timeout;
46    var mouse_x = 0;
47    var mouse_y = 0;
48
49    var Model = {
50        dag : null, 
51        dag_active_bias_graph : null,
52        dag_ancestor_moral_graph : null,
53        dag_ancestor_pair_graph : null,
54        dag_model_text_data : null
55    };
56
57    var DAGittyControl;
58
59    function initialize(){
60
61
62        DAGitty.setup({autofocus:true});
63        DAGittyControl = DAGitty.controllers[0];
64        
65        GUI.menus = ["model","examples","howto","layout","help"]
66        _.each(GUI.menus,function(t){
67            document.getElementById("menu_"+t+"_title").addEventListener( 'click', 
68                function(){menuToggle(t)} );
69        });
70        
71        DAGittyControl.observe( 'graphchange',
72            function(g){
73                Model.dag = g;
74                document.getElementById("adj_matrix").value = g.toString();
75                // if previously highlighted variable no longer exists, fold up this menu
76                if( !g.getVertex(document.getElementById("variable_id").value) ){
77                    document.getElementById("variable_id").value = ''
78                }
79                displayImplicationInfo( false )
80                causalEffectEstimates( document.getElementById("causal_effect_kind").value )
81                displayGeneralInfo()
82                GUI.refresh_variable_status()
83            }
84        );
85        
86        DAGittyControl.observe( 'graphlayoutchange',
87            function(g){
88                document.getElementById("adj_matrix").value = g.toString();
89            }
90        );
91
92        DAGittyControl.observe( 'vertex_marked',
93            function( v ){
94                if( v ){
95                    displayShow( 'variable' )
96                    document.getElementById("variable_id").value = v.id
97                    GUI.refresh_variable_status()
98                } else {
99                    if( !Model.dag.getVertex(document.getElementById("variable_id").value) ){
100                        displayHide( 'variable' )
101                    }
102                }
103            }
104        );
105
106        var getid = (function(){
107            var regexS = "[\\?&]id=([^&#]*)";
108            var regex = new RegExp(regexS);
109            var results = regex.exec(window.location.search);
110            if(results == null)
111                return "";
112            else
113                return decodeURIComponent(results[1].replace(/\+/g, " "));
114        })();
115
116        if( getid ){
117            // load user-supplied model
118            loadOnline( "dagitty.net/m"+getid );
119        } else {
120            DAGittyControl.graphChanged();
121        }
122
123        document.onkeydown = function(e){
124            if( e.keyCode == 27 ){
125                DAGittyControl.getView().getImplementation().stopMousemove()
126                DAGittyControl.getView().closeDialog()
127            }
128        }
129    }
130    window.onload = initialize;
131    </script>
131
132    
133</head>
134<body>
135
136<main>
137
138    <ul id="menu">
139      <li><a href="javascript:void(0)" id="menu_model_title">Model</a>
140         <ul id="menu_model" style="z-Index:15">
141            <li><a href="#" onclick="newModel();displayHide('menu_model')">New model</a></li>
142            <li><a href="#" onclick="loadOnlineForm();displayHide('menu_model')">Load from dagitty.net</a></li>
143            <li><a href="#" onclick="exportPNG();displayHide('menu_model')">Export as PNG</a></li>
144            <li><a href="#" onclick="exportJPEG();displayHide('menu_model')">Export as JPEG</a></li>
145            <!--<li><a href="#" onclick="exportSVG();displayHide('menu_model')">Export as SVG</a></li>-->
146            <li><a href="#" onclick="saveOnlineForm();displayHide('menu_model')">Publish on dagitty.net</a></li>
147
148            
148<script>
149                if( false && document.location.protocol == "https:" ){
150                    document.write('<li><a href="#" onclick="saveOnlineForm();displayHide(\'menu_model\')">Publish on dagitty.net</a></li>');
151                    document.write('<li><a href="#" onclick="updateOnlineForm();displayHide(\'menu_model\')">Update on dagitty.net</a></li>');
152                    document.write('<li><a href="#" onclick="deleteOnlineForm();displayHide(\'menu_model\')">Delete on dagitty.net</a></li>');
153            }
154
155               if( false && supportsSVG() ){
156                    document.write( '<li><a href="#" onclick="exportPDF();displayHide(\'menu_model\')">Export as PDF</a></li>' );
157               }
158            </script>
158
159        <li><a href="#" onclick="exportTikzCode();displayHide('menu_model')">Export LaTeX code</a></li>
160    </ul>
161      </li>
162      <li><a href="javascript:void(0)" id="menu_examples_title">Examples</a>
163       <ul id="menu_examples" style="z-Index:14">
164         
164<script>
165         for( var i = 0 ; i < examples.length ; i++ ){
166            document.write( "<li><a href=\"#\" onclick=\"loadExample("+i+");displayHide('menu_examples')\">"+examples[i].l+"</a></li>" );
167         }
168         </script>
168
169       </ul>
170      </li>
171      <li><a href="javascript:void(0)" id="menu_howto_title">How to ...</a>
172         <ul id="menu_howto" style="z-Index:13">
173            <li><a href="#" onclick="how('To add a new variable, click/tap on the canvas.')">Add a variable</a></li>
174            <li><a href="#" onclick="how('To rename a variable, click/tap it and click/tap &quot;rename&quot; in the &quot;variable&quot; tab, or move the mouse over it and press the &quot;r&quot; key on your keyboard.')">Rename a variable</a></li>
175            <li><a href="#" onclick="how('To add a new connection, click/tap on the start variable and then on the end variable.')">Add a connection</a></li>
176            <li><a href="#" onclick="how('To delete a variable, click/tap it and then clik/tap &quot;delete&quot; in the &quot;variable&quot; tab, or move the mouse over it and press the &quot;delete&quot; or the &quot;d&quot; key on your keyboard.')">Delete a variable</a></li>
177            <li><a href="#" onclick="how('To delete a connection, click/tap on the start variable and then on the end variable.')">Delete a connection</a></li>   
178            <li><a href="#" onclick="how('To save the model, copy-paste the content of the &quot;model code&quot; into your favourite text editor (e.g. &quot;Word&quot;).')">Save a model</a></li>
179            <li><a href="#" onclick="how('To set the exposure variable, click/tap it and check &quot;exposure&quot; in the &quot;variable&quot; tab, or move the mouse over it and press the &quot;e&quot; key on your keyboard.')">Set exposure variable</a></li>
180            <li><a href="#" onclick="how('To set the outcome variable, click/tap it and check &quot;outcome&quot; in the &quot;variable&quot; tab, or move the mouse over it and press the &quot;o&quot; key on your keyboard.')">Set outcome variable</a></li>
181            <li><a href="#" onclick="how('To toggle adjustment for a variable, click/tap it and check &quot;adjusted&quot; in the &quot;variable&quot; tab, or move the mouse over it and press the &quot;a&quot; key on your keyboard.')">Adjust for variable</a></li>
182            <li><a href="#" onclick="how('To toggle selection status for a variable, click/tap it and check &quot;selected&quot; in the &quot;variable&quot; tab, or move the mouse over it and press the &quot;s&quot; key on your keyboard.')">Define a selection variable</a></li>
183            <li><a href="#" onclick="how('To toggle observed status for a variable, click/tap it and check &quot;unobserved&quot; in the &quot;variable&quot; tab, or move the mouse over it and press the &quot;u&quot; key on your keyboard.')">Make a variable unobserved (latent)</a></li>
184         </ul>
185      </li>
186      <li><a href="javascript:void(0)" id="menu_layout_title">Layout</a>
187         <ul id="menu_layout" style="z-Index:12">
188            <li><a href="#" onclick="generateSpringLayout();displayHide('menu_layout');return false">Generate layout automatically</a></li>
189         </ul>
190      </li>
191      <li style="border-right:none"><a href="javascript:void(0)" id="menu_help_title">Help</a>
192         <ul id="menu_help" style="z-Index:11">
193            <li><a href="manual-3.x.pdf" target="_blank" onclick="displayHide('menu_help')">Manual</a></li>
194            <li><a href="https://dagitty.net/learn/" target="_blank" onclick="displayHide('menu_help')">Other Resources</a></li>
195         </ul>
196      </li>
197      <li style="float:none; overflow: hidden; border-right: none;"> &nbsp;</li>
198   </ul>
199
200   <div id="canvas" class="dagitty" data-mutable="true">
201A [selected,pos="-2.200,-1.520"]
202B [pos="1.400,-1.460"]
203D [outcome,pos="1.400,1.621"]
204E [exposure,pos="-2.200,1.597"]
205Z [adjusted,pos="-0.300,-0.082"]
206A -&gt; E
207A -&gt; Z [pos="-0.791,-1.045"]
208B -&gt; D
209B -&gt; Z [pos="0.680,-0.496"]
210E -&gt; D
211   </div>
212
213</main>
214
215<aside>
216
217   <div id="llegend">
218
219    <h3 onclick="displayToggle('variable')"><img src="images/arrow-down.png" alt="" id="a_variable">
220        Variable</h3>
221   <div id="variable" style="display:block">
222
223      <form autocomplete="off">
224    <p>
225        <span id="variable_label" style="font-weight:bold"></span>
226    </p>
227      <p><input type="checkbox" checked="checked" id="variable_exposure"
228         onclick="GUI.set_variable_status('source',this.checked)" />
229            <label for="variable_exposure">exposure</label></p>
230      <p><input type="checkbox" checked="checked" id="variable_outcome"
231         onclick="GUI.set_variable_status('target',this.checked)" />
232            <label for="variable_outcome">outcome</label></p>
233      <p><input type="checkbox" checked="checked" id="variable_adjusted"
234         onclick="GUI.set_variable_status('adjustedNode',this.checked)" />
235            <label for="variable_adjusted">adjusted</label></p>
236      <p><input type="checkbox" checked="checked" id="variable_selected"
237         onclick="GUI.set_variable_status('selectedNode',this.checked)" />
238            <label for="variable_selected">selected</label></p>
239      <p><input type="checkbox" checked="checked" id="variable_unobserved"
240         onclick="GUI.set_variable_status('latentNode',this.checked)" />
241            <label for="variable_unobserved">unobserved</label></p>
242
243    <input type="hidden" id="variable_id" value="">
244
245    <p>
246        <button type="button" onclick="DAGittyControl.deleteVertex(document.getElementById('variable_id').value)">delete</button>
247        <button type="button" onclick="DAGittyControl.getView().renameVertexDialog(document.getElementById('variable_id').value)">rename</button>
248    </p>
249
250      </form>
251
252
253
254   </div>
255   
256  
257   <h3 onclick="displayToggle('viewmode')"><img src="images/arrow-down.png" alt="" id="a_view">
258        View mode</h3>
259   <div id="viewmode" style="display:block">
260
261      <form autocomplete="off">
262      <p><input type="radio" checked="checked" id="dagview_normal" name="dagview"
263         onclick="GUI.set_view_mode(this.value)" value="normal" /> 
264            <label for="dagview_normal">normal</label></p>
265      <p><input type="radio" name="dagview" id="dagview_moral"
266         onclick="GUI.set_view_mode(this.value)" value="moral"/>
267            <label for="dagview_moral">moral graph</label></p>
268      <p><input type="radio" name="dagview" id="dagview_dependency"
269         onclick="GUI.set_view_mode(this.value)" value="dependency"/>
270            <label for="dagview_dependency">correlation graph</label></p>
271      <p><input type="radio" name="dagview" id="dagview_equivalence"
272         onclick="GUI.set_view_mode(this.value)" value="equivalence"/>
273            <label for="dagview_equivalence">equivalence class</label></p>
274      </form>
275
276   </div>
277   
278   <h3 onclick="displayToggle('effects')"><img src="images/arrow-down.png" alt="" id="a_effects"> Effect analysis</h3>
279   <div id="effects" style="display:block">
280      <form autocomplete="off">
281      <p><input type="checkbox" id="highlight_puredirect"
282         onclick="GUI.set_highlight_puredirect(this.checked)"/>
283            <label for="highlight_puredirect">atomic direct effects</label></p>
284      </form>
285   </div>
286
287   <h3 onclick="displayToggle('dagstyle')"><img src="images/arrow-down.png" alt="" id="a_dagstyle">
288        Diagram style</h3>
289   <div id="dagstyle" style="display:block">
290      <form autocomplete="off">
291      <p><input type="radio" checked="checked" id="dagstyle_original" name="dagstyle"
292         onclick="GUI.set_style('original')" /> 
293            <label for="dagstyle_original">classic</label></p>
294      <p><input type="radio" name="dagstyle" id="dagstyle_semlike"
295         onclick="GUI.set_style('semlike')"/>
296            <label for="dagstyle_semlike">SEM-like</label></p>
297      </form>
298   </div>
299
300   <h3 onclick="displayToggle('coloring')"><img src="images/arrow-down.png" alt="" id="a_coloring"> Coloring</h3>
301   <div id="coloring" style="display:block">
302      <form autocomplete="off">
303      <p><input type="checkbox" checked="checked" id="highlight_causal"
304         onclick="GUI.set_highlight_causal(this.checked)" />
305            <label for="highlight_causal">causal paths</label></p>
306      <p><input type="checkbox" checked="checked" id="highlight_biasing"
307         onclick="GUI.set_highlight_biasing(this.checked)"/>
308            <label for="highlight_biasing">biasing paths</label></p>
309      <p><input type="checkbox" checked="checked" id="highlight_ancestral"
310         onclick="GUI.set_highlight_ancestors(this.checked)"/>
311            <label for="highlight_ancestral">ancestral structure</label></p>
312      </form>
313   </div>
314
315
316
317   <h3 onclick="displayToggle('legend')"><img src="images/arrow-down.png" alt="" id="a_legend"> Legend</h3>
318   <div id="legend" style="display:block">
319      <p>
320        <img id="liexposure" src="images/legend/original/exposure.png" alt="" />
321        exposure
322      </p>
323      <p>
324        <img id="lioutcome" src="images/legend/original/outcome.png" alt="" />
325         outcome
326      </p>
327      <div id="legend_ancestors">
328      <p>
329         <img id="lilnode" src="images/legend/original/lnode.png" alt="" />
330         ancestor of exposure
331      </p>
332      <p>
333        <img id="lirnode" src="images/legend/original/rnode.png" alt="" />
334         ancestor of outcome
335      </p>
336      <p>
337        <img id="limnode"  src="images/legend/original/mnode.png" alt="" />
338        ancestor of exposure <em>and</em> outcome
339      </p> 
340      </div>
341      <p>
342        <img id="liadjustednode" src="images/legend/original/adjustednode.png" alt="" />
343        adjusted variable
344      </p>
345      <p>
346        <img id="lilatentnode" src="images/legend/original/latentnode.png" alt="" />
347        unobserved (latent)
348      </p>
349      <p>
350        <img id="liother" src="images/legend/original/other.png" alt="" />
351         other variable
352      </p>
353      <p id="legend_causal">
354        <img id="licausalpath" src="images/legend/original/causalpath.png" alt="" />
355        causal path
356      </p>
357      <p id="legend_biasing">
358        <img id="libiasingpath" src="images/legend/original/biasingpath.png" alt="" />
359        biasing path
360      </p>
361   </div>
362
363  </div>
364
365
366   <div id="rlegend">
367        <h3 onclick="displayToggle('causal_effect_block')">
368            <img src="images/arrow-down.png" alt="" id="a_causal_effect" />
369            Causal effect identification
370        </h3>
371
372    <div id="causal_effect_block">
373        <p>
374            <select id="causal_effect_kind" onchange="causalEffectEstimates(this.value)">
375                <option value="adj_total">Adjustment (total effect)</option>
376                <option value="adj_causalodds">Adjustment (causal odds ratio)</option>
377                <option value="adj_direct">Adjustment (direct effect)</option>
378                <option value="instrument">Instrumental variable</option>
379                <!--<option value="treeid">TreeId</option>-->
380            </select>
381        </p>
382        <div id="causal_effect" style="display:block">
383
384        </div>
385    </div>
386
387    <h3 onclick="displayToggle('testable_implications')"><img src="images/arrow-down.png" alt="" id="a_testable_implications" />  Testable implications</h3>
388
389    <div id="testable_implications" style="display:block">
390
391    </div>
392
393    <h3 onclick="displayToggle('model_data')"><img src="images/arrow-down.png" alt="" id="a_model_data" />  Model code</h3>
394    <div id="model_data" style="display:block">
395      <form name="model_data_frm">
396      <textarea rows="10" cols="35" name="adj_matrix" id="adj_matrix"
397         onkeydown="if(this.value != Model.dag_model_text_data){ displayShow('model_refresh');this.style.backgroundColor='#fec'; }"></textarea>
398      </form>
399      <p id="model_refresh" style="display:none">You have modified the model code. To
400      draw the modified model, click here: <button onclick="loadDAGFromTextData()">Update DAG</button></p>
401    </div>
402
403   <h3 onclick="displayToggle('summary')"><img src="images/arrow-down.png" alt="" id="a_summary"> Summary</h3>
404   <div id="summary" style="display:block">
405      <div id="info_cycle"> </div>
406      <table id="info_summary">
407         <tr><td>exposure(s)</td><td class="info" id="info_exposure">not set</td></tr>
408         <tr><td>outcome(s)</td><td class="info" id="info_outcome">not set</td></tr>
409         <tr><td>covariates</td><td class="info" id="info_covariates">0</td></tr>
410         <tr><td>causal paths</td><td class="info" id="info_frontdoor">0</td></tr>
411      </table>
412   </div>
413
414   </div>
415
416</aside>
417
418</body>
419</html>

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.