diff --git a/dist/circosJS.js b/dist/circosJS.js index b497403..bbfb0ce 100644 --- a/dist/circosJS.js +++ b/dist/circosJS.js @@ -439,7 +439,7 @@ circosJS.Chord = function() { })(this); this.renderChords = function(parentElement, name, conf, data, layout, ratio, getSource, getTarget) { var link, track; - track = parentElement.append('g').attr('class', name + ' ' + conf.colorPalette); + track = parentElement.append('g').attr('class', conf.colorPalette); link = track.selectAll('.chord').data(data).enter().append('path').attr('class', 'chord').attr('d', d3.svg.chord().source(function(d) { return getSource(d, layout); }).target(function(d) { @@ -459,7 +459,10 @@ circosJS.Chord = function() { }; this.render = (function(_this) { return function(instance, parentElement, name) { - return _this.renderChords(parentElement, name, _this.conf, _this.data, instance._layout, _this.ratio, _this.getSource, _this.getTarget); + var track; + parentElement.select('.' + name).remove(); + track = parentElement.append('g').attr('class', name); + return _this.renderChords(track, name, _this.conf, _this.data, instance._layout, _this.ratio, _this.getSource, _this.getTarget); }; })(this); return this; @@ -471,7 +474,7 @@ circosJS.Heatmap = function() { this.renderDatumContainer = (function(_this) { return function(instance, parentElement, name, data, conf) { var group, track; - track = parentElement.append('g').attr('class', name + ' ' + conf.colorPalette); + track = parentElement.append('g').attr('class', conf.colorPalette); return group = _this.renderBlock(track, data, instance._layout); }; })(this); @@ -495,7 +498,7 @@ circosJS.Histogram = function() { this.renderDatumContainer = (function(_this) { return function(instance, parentElement, name, data, conf) { var group, track; - track = parentElement.append('g').attr('class', name + ' ' + _this.conf.colorPalette); + track = parentElement.append('g').attr('class', _this.conf.colorPalette); return group = _this.renderBlock(track, data, instance._layout); }; })(this); @@ -733,7 +736,7 @@ circosJS.Stack = function() { this.renderDatumContainer = (function(_this) { return function(instance, parentElement, name, data, conf) { var group, track; - track = parentElement.append('g').attr('class', name + ' ' + conf.colorPalette); + track = parentElement.append('g').attr('class', conf.colorPalette); return group = _this.renderBlock(track, data, instance._layout); }; })(this); @@ -856,8 +859,10 @@ circosJS.Track = function() { }; this.render = (function(_this) { return function(instance, parentElement, name) { - var datumContainer, _ref; - datumContainer = _this.renderDatumContainer(instance, parentElement, name, _this.data, _this.conf); + var datumContainer, track, _ref; + parentElement.select('.' + name).remove(); + track = parentElement.append('g').attr('class', name); + datumContainer = _this.renderDatumContainer(instance, track, name, _this.data, _this.conf); if ((_ref = _this.conf.axes) != null ? _ref.display : void 0) { _this.renderAxes(datumContainer, _this.conf, instance._layout, _this.data); } @@ -1048,7 +1053,7 @@ circosJS.renderLayoutTicks = function(conf, layout, d3, instance) { }; circosJS.Core.prototype.render = function(ids, removeTracks) { - var name, renderAll, svg, track, trackStore, trackType, tracks, _ref; + var name, renderAll, svg, track, trackStore, trackType, tracks, _ref, _ref1; if (typeof ids === 'undefined') { renderAll = true; } @@ -1056,7 +1061,10 @@ circosJS.Core.prototype.render = function(ids, removeTracks) { if (renderAll || __indexOf.call(ids, 'layout') >= 0) { circosJS.renderLayout(d3, svg, this); } - tracks = svg.append('g').attr('class', 'tracks').attr('transform', 'translate(' + parseInt(this.conf.width / 2) + ',' + parseInt(this.conf.height / 2) + ')'); + tracks = svg.select('.tracks'); + if (tracks.empty()) { + tracks = svg.append('g').attr('class', 'tracks').attr('transform', 'translate(' + parseInt(this.conf.width / 2) + ',' + parseInt(this.conf.height / 2) + ')'); + } _ref = this.tracks; for (trackType in _ref) { trackStore = _ref[trackType]; @@ -1065,6 +1073,16 @@ circosJS.Core.prototype.render = function(ids, removeTracks) { track.render(this, tracks, name); } } + if (removeTracks) { + _ref1 = this.tracks; + for (trackType in _ref1) { + trackStore = _ref1[trackType]; + for (name in trackStore) { + track = trackStore[name]; + svg.select('.' + name).remove(); + } + } + } }; circosJS.Core.prototype.defaultConf = { diff --git a/src/render.coffee b/src/render.coffee index 2677e0c..51bbf17 100644 --- a/src/render.coffee +++ b/src/render.coffee @@ -7,23 +7,25 @@ circosJS.Core.prototype.render = (ids, removeTracks) -> svg = d3.select @conf.container if renderAll or 'layout' in ids - circosJS.renderLayout d3, svg, this + circosJS.renderLayout d3, svg, @ - tracks = svg.append 'g' - .attr 'class', 'tracks' - .attr 'transform', 'translate(' + parseInt(@conf.width/2) + ',' + parseInt(@conf.height/2) + ')' + tracks = svg.select('.tracks') + if tracks.empty() + tracks = svg.append 'g' + .attr 'class', 'tracks' + .attr 'transform', 'translate(' + parseInt(@conf.width/2) + ',' + parseInt(@conf.height/2) + ')' for trackType, trackStore of @tracks for name, track of trackStore - track.render this, tracks, name + track.render @, tracks, name - # if removeTracks - # # remove all tracks to be sure to keep consistent data - # # TODO: a smarter strategy could be implemented: - # # remove tracks only if layout data changes - # for trackType in types - # for trackName in Object.keys(trackType.store) - # svg.select('.' + trackName).remove() + if removeTracks + # remove all tracks to be sure to keep consistent data + # TODO: a smarter strategy could be implemented: + # remove tracks only if layout data changes + for trackType, trackStore of @tracks + for name, track of trackStore + svg.select('.' + name).remove() # renderBackgrounds = (d3Track, track, instance, d3, svg) -> # backgrounds = track._backgrounds @@ -98,5 +100,3 @@ circosJS.Core.prototype.render = (ids, removeTracks) -> # preRender trackName, track, @, d3, svg, trackType.renderFunction return - - diff --git a/src/tracks/Chord.coffee b/src/tracks/Chord.coffee index 21d69de..ff215f2 100644 --- a/src/tracks/Chord.coffee +++ b/src/tracks/Chord.coffee @@ -31,7 +31,7 @@ circosJS.Chord = -> @renderChords = (parentElement, name, conf, data, layout, ratio, getSource, getTarget) -> track = parentElement .append 'g' - .attr 'class', name + ' ' + conf.colorPalette + .attr 'class', conf.colorPalette link = track .selectAll '.chord' @@ -51,6 +51,10 @@ circosJS.Chord = -> link.attr 'fill', (d) -> d.color || conf.color @render = (instance, parentElement, name) => - @renderChords parentElement, name, @conf, @data, instance._layout, @ratio, @getSource, @getTarget + parentElement.select('.' + name).remove() + track = parentElement.append 'g' + .attr 'class', name + + @renderChords track, name, @conf, @data, instance._layout, @ratio, @getSource, @getTarget @ diff --git a/src/tracks/Heatmap.coffee b/src/tracks/Heatmap.coffee index 95d0f89..8f185f0 100644 --- a/src/tracks/Heatmap.coffee +++ b/src/tracks/Heatmap.coffee @@ -4,7 +4,7 @@ circosJS.Heatmap = -> @renderDatumContainer = (instance, parentElement, name, data, conf) => track = parentElement.append 'g' - .attr 'class', name + ' ' + conf.colorPalette + .attr 'class', conf.colorPalette group = @renderBlock track, data, instance._layout diff --git a/src/tracks/Histogram.coffee b/src/tracks/Histogram.coffee index d235efb..3bc6234 100644 --- a/src/tracks/Histogram.coffee +++ b/src/tracks/Histogram.coffee @@ -4,7 +4,7 @@ circosJS.Histogram = -> @renderDatumContainer = (instance, parentElement, name, data, conf) => track = parentElement.append 'g' - .attr 'class', name + ' ' + @conf.colorPalette + .attr 'class', @conf.colorPalette group = @renderBlock track, data, instance._layout @renderDatum = (parentElement, conf, layout, utils) -> diff --git a/src/tracks/Stack.coffee b/src/tracks/Stack.coffee index e7e36f4..9aa3788 100644 --- a/src/tracks/Stack.coffee +++ b/src/tracks/Stack.coffee @@ -76,7 +76,7 @@ circosJS.Stack = -> @renderDatumContainer = (instance, parentElement, name, data, conf) => track = parentElement.append 'g' - .attr 'class', name + ' ' + conf.colorPalette + .attr 'class', conf.colorPalette group = @renderBlock track, data, instance._layout @renderDatum = (parentElement, conf, layout, utils) -> diff --git a/src/tracks/Track.coffee b/src/tracks/Track.coffee index 189d148..901f6d5 100644 --- a/src/tracks/Track.coffee +++ b/src/tracks/Track.coffee @@ -68,7 +68,10 @@ circosJS.Track = -> return Math.floor(scope * x) @render = (instance, parentElement, name) => - datumContainer = @renderDatumContainer instance, parentElement, name, @data, @conf + parentElement.select('.' + name).remove() + track = parentElement.append 'g' + .attr 'class', name + datumContainer = @renderDatumContainer instance, track, name, @data, @conf @renderAxes(datumContainer, @conf, instance._layout, @data) if @conf.axes?.display @renderDatum datumContainer, @conf, instance._layout, @