Dashboards & Visualizations

panel-footer in custom visualizations

Communicator

I'm making a custom visualization, much like the D3 Parallel Coordinates example in the Simple XML Examples app. I'd like to have a panel-footer at the bottom of my visualization with links to the search page, etc., just like on the other charts. Does anybody know how to do this?

0 Karma
1 Solution

Communicator

I figured out how to do this, so just in case anybody else is interested, here's how:

this.$el.after("<div class='panel-footer'></div>");
this.resultsLink = new ResultsLinkView(_.extend({}, {}, this.options, {
    id: _.uniqueId(this.id + '-resultslink'),
    el: $('<div class="view-results pull-left"></div>').appendTo($('.panel-footer', this.$el.parent())),
    manager: this.manager.id
})).render();

You can see more context for this snippet in github and you can see it in action in my gantt visualization app.

View solution in original post

Communicator

I figured out how to do this, so just in case anybody else is interested, here's how:

this.$el.after("<div class='panel-footer'></div>");
this.resultsLink = new ResultsLinkView(_.extend({}, {}, this.options, {
    id: _.uniqueId(this.id + '-resultslink'),
    el: $('<div class="view-results pull-left"></div>').appendTo($('.panel-footer', this.$el.parent())),
    manager: this.manager.id
})).render();

You can see more context for this snippet in github and you can see it in action in my gantt visualization app.

View solution in original post