Commit e142b83d by DarshanKumar

New Lineage Updated

new linage updated
parent 2b4ffc4e
......@@ -120,10 +120,10 @@ footer.navbar-bottom img {
min-height: 0;
padding: 5px 5px 5px 0;
}
#Details
{
height: 800px;
}
/*#Details*/
/*{*/
/*height: 800px;*/
/*}*/
.pagination {
float: right;
}
......
......@@ -16,26 +16,28 @@
* limitations under the License.
*/
g circle {
cursor: pointer;
stroke: green;
stroke-width: 2px;
fill: url(#process-image);
}
/*g circle {*/
/*cursor: pointer;*/
/*stroke: green;*/
/*stroke-width: 2px;*/
/*fill: url(#process-image);*/
/*}*/
g circle.empty {
fill: #90ef96;
}
/*g circle.empty {*/
/*fill: #90ef96;*/
/*}*/
.link {
fill: none;
stroke: green;
stroke-width: 2px;
}
g text {
pointer-events: none;
text-shadow: 0 1px 0 #fff, 1px 0 0 #fff, 0 -1px 0 #fff, -1px 0 0 #fff;
text-align: center;
}
.d3-tip pre {
......@@ -44,28 +46,35 @@ g text {
div.lineage {
border-bottom: 2px solid #006600;
margin-bottom: 30px;
}
.node rect {
stroke: #333;
fill: #fff;
}
/*.node rect {*/
/*stroke: #333;*/
/*fill: #fff;*/
/*}*/
.edgePath path {
stroke: #333;
fill: #333;
stroke-width: 1.5px;
}
.node rect,
.node circle {
stroke: #333;
fill: #fff;
stroke-width: 1.5px;
}
/*.node rect,*/
/*.node circle {*/
/*stroke: #333;*/
/*fill: #fff;*/
/*stroke-width: 1.5px;*/
/*}*/
.lineage-viz {
padding: 10px;
padding: 5px;
margin: 0 auto;
overflow: auto;
border-top: none;
border-right: inherit ;
}
/*.images {*/
/*background-image: url("../img/process.png");*/
/*}​*/
File mode changed from 100755 to 100644
......@@ -39,7 +39,7 @@
</table>
</tab>
<tab data-heading="Schema"><ng-include src="'/modules/details/views/schema.html'"/></tab>
<tab data-heading="Output" data-disable="!tableName" data-select="onActivate('outputs')"><ng-include data-table-type="outputs" src="'/modules/lineage/views/lineage.html'"/></tab>
<tab data-heading="Output" data-disable="!tableName" data-select="onActivate('outputs')"><ng-include data-table-type="outputs" src="'/modules/lineage/views/lineage.html'"/></tab>
<tab data-heading="Input" data-disable="!tableName" data-select="onActivate('inputs')"><ng-include data-table-type="inputs" src="'/modules/lineage/views/lineage.html'"/></tab>
</tabset>
......
......@@ -69,7 +69,8 @@ angular.module('dgc.lineage').controller('LineageController', ['$element', '$sco
function getNode(guid) {
var vertex = {
guid: guid,
name: vertices.hasOwnProperty(guid) ? vertices[guid].values.name : 'Load Process-Added'
name: vertices.hasOwnProperty(guid) ? vertices[guid].values.name : 'Load Process',
type: vertices.hasOwnProperty(guid) ? vertices[guid].values.vertexId.values.typeName : 'LoadProcess'
};
if (!nodes.hasOwnProperty(guid)) {
nodes[guid] = vertex;
......@@ -108,10 +109,10 @@ angular.module('dgc.lineage').controller('LineageController', ['$element', '$sco
height = Math.max(container.height, 350);
var margin = {
top: 20,
right: 120,
bottom: 20,
left: 120
top: 100,
right: 10,
bottom: 30,
left: 100
};
width = width - margin.right - margin.left;
height = height - margin.top - margin.bottom;
......@@ -119,7 +120,8 @@ angular.module('dgc.lineage').controller('LineageController', ['$element', '$sco
var i = 0;
var tree = d3.layout.tree()
.size([height, width]);
.size([height, width]);
var diagonal = d3.svg.diagonal()
.projection(function(d) {
......@@ -130,8 +132,11 @@ angular.module('dgc.lineage').controller('LineageController', ['$element', '$sco
.attr('width', width + margin.right + margin.left)
.attr('height', height + margin.top + margin.bottom)
.select('g')
.attr('transform',
'translate(' + margin.left + ',' + margin.top + ')');
.attr('transform',
'translate(' + margin.left + ',' + margin.right + ')');
//arrow
svg.append("svg:defs").append("svg:marker").attr("id", "arrow").attr("viewBox", "0 0 10 10").attr("refX", 26).attr("refY", 5).attr("markerUnits", "strokeWidth").attr("markerWidth", 6).attr("markerHeight", 9).attr("orient", "auto").append("svg:path").attr("d", "M 0 0 L 10 5 L 0 10 z");
var root = data;
......@@ -159,28 +164,30 @@ angular.module('dgc.lineage').controller('LineageController', ['$element', '$sco
return 'translate(' + d.y + ',' + d.x + ')';
});
nodeEnter.append('image')
.attr('xlink:href', function(d) {
return d.icon;
nodeEnter.append("image")
.attr("xlink:href", function(d) {
//return d.icon;
return d.type === 'Table' ? '../img/tableicon.png' : '../img/process.png';
})
.attr('x', '-12px')
.attr('y', '-12px')
.attr('width', '24px')
.attr('height', '24px');
.attr("x", "-12px")
.attr("y", "-12px")
.attr("width", "24px")
.attr("height", "24px");
nodeEnter.append('text')
.attr('x', function(d) {
return d.children || d._children ?
(15) * -1 : +15;
(5) * -1 : +15;
})
.attr('dy', '.35em')
.attr('dy', '-1.35em')
.attr('text-anchor', function(d) {
return d.children || d._children ? 'end' : 'start';
return d.children || d._children ? 'middle' : 'middle';
})
.text(function(d) {
return d.name;
})
.style('fill-opacity', 1);
.style('fill-opacity', 1);
// Declare the links…
var link = svg.selectAll('path.link')
......@@ -188,12 +195,12 @@ angular.module('dgc.lineage').controller('LineageController', ['$element', '$sco
return d.target.id;
});
// Enter the links.
link.enter().insert('path', 'g')
.attr('class', 'link')
//.style('stroke', function(d) { return d.target.level; })
.style('stroke', '#000')
.style('stroke', 'green')
.attr('d', diagonal);
link.attr("marker-end", "url(#arrow)");
}
......
......@@ -19,7 +19,7 @@
<div class="lineage-viz" data-ng-controller="LineageController">
<h4 data-ng-if="!requested && !lineageData">No lineage data found</h4>
<i data-ng-if="requested" class="fa fa-spinner fa-spin fa-5x"></i>
<svg>
<svg >
<g/>
</svg>
</div>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment