dhtmlxgantt - basic - diaglog example

HTML

<link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.9.1.js"></script>
<script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
<script src="http://docs.dhtmlx.com/gantt/codebase/dhtmlxgantt.js"></script>
<link rel="stylesheet" href="http://docs.dhtmlx.com/gantt/codebase/dhtmlxgantt.css">
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>
<script src="https://code.highcharts.com/modules/export-data.js"></script>

<div id="dialog" title="Basic dialog">
	
</div>

CSS

#dialog{
    padding:0 !important;
    
}

JavaScript

$(function() {
    $( "#dialog" ).dialog({
        width:600,
        height:400,
        resizeStop: function( event, ui ) {
            gantt.render();
        }
    });
    
    function stacked_chart() {
     return 'hi'
    }
    gantt.config.order_branch = true;
    gantt.init("dialog");
gantt.config.columns =  [
    {name:"text",       label:"Task name",  tree:true, width:"*" },
    {name:"holder",     label:"Holder",     align:"center" },
    {name:"start_date", label:"Start time", align:"center" },
    {name:"end_date",   label:"End date",   align:"center" },
    {name:"progress",   label:"Progress",   align:"center" },
    {name:"potato",   label:"Potato",   align:"center", template: stacked_chart(obj)},

];    
    
    
    gantt.parse( {
	"data":[
		{"id":11, "text":"Project #1", "start_date":"28-03-2013", "duration":"11", "potato": 0.6, "open": true, 'new': 23423},
		{"id":1, "text":"Project #2", "start_date":"01-04-2013", "duration":"18", "progress": 0.4, "open": true},

		{"id":2, "text":"Task #1", "start_date":"02-04-2013", "duration":"8", "parent":"1", "progress":0.5, "open": true},
		{"id":3, "text":"Task #2", "start_date":"11-04-2013", "duration":"8", "parent":"1", "progress": 0.6, "open": true},
		{"id":4, "text":"Task #3", "start_date":"13-04-2013", "duration":"6", "parent":"1", "progress": 0.5, "open": true},
		{"id":5, "text":"Task #1.1", "start_date":"02-04-2013", "duration":"7", "parent":"2", "progress": 0.6, "open": true},
		{"id":6, "text":"Task #1.2", "start_date":"03-04-2013", "duration":"7", "parent":"2", "progress": 0.6, "open": true},
		{"id":7, "text":"Task #2.1", "start_date":"11-04-2013", "duration":"8", "parent":"3", "progress": 0.6, "open": true},
		{"id":8, "text":"Task #3.1", "start_date":"14-04-2013", "duration":"5", "parent":"4", "progress": 0.5, "open": true},
		{"id":9, "text":"Task #3.2", "start_date":"14-04-2013", "duration":"4", "parent":"4", "progress": 0.5, "open": true},
		{"id":10, "text":"Task #3.3",...