diff --git a/frontend-js/src/main/js/gui/export/AbstractExportPanel.js b/frontend-js/src/main/js/gui/export/AbstractExportPanel.js
index 2f16acc9ab0bb39f710da2871ee832c1e5ace72d..c55f8063bcd6e589b72962ebd8e3cb77c07a7680 100644
--- a/frontend-js/src/main/js/gui/export/AbstractExportPanel.js
+++ b/frontend-js/src/main/js/gui/export/AbstractExportPanel.js
@@ -238,18 +238,23 @@ AbstractExportPanel.prototype._getCompartmentNames = function() {
   });
 };
 
-AbstractExportPanel.prototype._getAllCompartments = function() {
+AbstractExportPanel.prototype.getModels = function() {
   var self = this;
-  var compartments = [];
-  var i;
-
   var models = [ self.getProject().getModel() ];
-  for (i = 0; i < self.getProject().getModel().getSubmodels().length; i++) {
+  for (var i = 0; i < self.getProject().getModel().getSubmodels().length; i++) {
     models.push(self.getProject().getModel().getSubmodels()[i]);
   }
+  return models;
+};
+
+AbstractExportPanel.prototype._getAllCompartments = function() {
+  var self = this;
+  var compartments = [];
+
+  var models = self.getModels();
 
   var promises = [];
-  for (i = 0; i < models.length; i++) {
+  for (var i = 0; i < models.length; i++) {
     promises.push(models[i].getCompartments());
   }
 
@@ -282,7 +287,7 @@ AbstractExportPanel.prototype._createDownloadButton = function() {
           type : "text/plain;charset=utf-8"
         });
         var FileSaver = require("file-saver");
-        return FileSaver.saveAs(blob, self.getProject().getProjectId() + "-" + self.getPanelName() + ".txt");
+        return FileSaver.saveAs(blob, self.getSaveFilename());
       }).then(function() {
         GuiConnector.hideProcessing();
       }, function(error) {
@@ -296,6 +301,11 @@ AbstractExportPanel.prototype._createDownloadButton = function() {
   return downloadDiv;
 };
 
+AbstractExportPanel.prototype.getSaveFilename = function() {
+  var self = this;
+  return self.getProject().getProjectId() + "-" + self.getPanelName() + ".txt";
+};
+
 AbstractExportPanel.prototype._createSelectIncludedCompartmentDiv = function() {
   var self = this;
   var typeDiv = Functions.createElement({
diff --git a/frontend-js/src/main/js/gui/export/GraphicsExportPanel.js b/frontend-js/src/main/js/gui/export/GraphicsExportPanel.js
index 0506c3af966931ae4ec5885c2fddd9998ea52f66..777387b9d79625f2e058e972a6842f656caf2a14 100644
--- a/frontend-js/src/main/js/gui/export/GraphicsExportPanel.js
+++ b/frontend-js/src/main/js/gui/export/GraphicsExportPanel.js
@@ -2,20 +2,156 @@
 
 /* exported logger */
 
-var Panel = require('../Panel');
+var AbstractExportPanel = require('./AbstractExportPanel');
+var Functions = require('../../Functions');
 
 var logger = require('../../logger');
 
 function GraphicsExportPanel(params) {
   params.panelName = "graphicsExport";
-  Panel.call(this, params);
+  AbstractExportPanel.call(this, params);
 }
 
-GraphicsExportPanel.prototype = Object.create(Panel.prototype);
+GraphicsExportPanel.prototype = Object.create(AbstractExportPanel.prototype);
 GraphicsExportPanel.prototype.constructor = GraphicsExportPanel;
 
 GraphicsExportPanel.prototype.init = function() {
+  var self = this;
+  var element = self.getElement();
+  var configuration;
+  element.appendChild(self._createSelectProjectDiv());
+  var configuration;
+  return ServerConnector.getConfiguration().then(function(result) {
+    configuration = result;
+    element.appendChild(self._createSelectGraphicsFormatDiv(configuration.getImageConverters()));
+    element.appendChild(self._createDownloadButton());
+  }).then(function() {
+    $(window).trigger('resize');
+  });
+};
+
+GraphicsExportPanel.prototype._createSelectProjectDiv = function(annotations) {
+  var self = this;
+  var project = self.getProject();
+  var typeDiv = Functions.createElement({
+    type : "div",
+    name : "modelSelectDiv",
+  });
+  typeDiv.appendChild(Functions.createElement({
+    type : "h4",
+    content : "(Sub)map:",
+  }));
+
+  var choicesContainer = Functions.createElement({
+    type : "ul",
+  });
+  typeDiv.appendChild(choicesContainer);
+
+  var models = self.getModels();
+
+  for (var i = 0; i < models.length; i++) {
+    var model = models[i];
+    var checkedString = "";
+    if (i === 0) {
+      checkedString = ' checked="checked" ';
+    }
+    var row = Functions.createElement({
+      type : "li",
+      content : '<div><label> <input type="radio" name="model" value="' + model.getId() + '"' + checkedString + '/>'
+          + model.getName() + '</label></div>',
+    });
+    choicesContainer.appendChild(row);
+  }
+
+  return typeDiv;
+};
+
+GraphicsExportPanel.prototype._createSelectGraphicsFormatDiv = function(formats) {
+  var self = this;
+  var project = self.getProject();
+  var typeDiv = Functions.createElement({
+    type : "div",
+    name : "formatSelectDiv",
+  });
+  typeDiv.appendChild(Functions.createElement({
+    type : "h4",
+    content : "Format:",
+  }));
+
+  var choicesContainer = Functions.createElement({
+    type : "ul",
+  });
+  typeDiv.appendChild(choicesContainer);
+
+  for (var i = 0; i < formats.length; i++) {
+    var format = formats[i];
+    var checkedString = "";
+    if (i === 0) {
+      checkedString = ' checked="checked" ';
+    }
+    var row = Functions.createElement({
+      type : "li",
+      content : '<div><label> <input type="radio" name="format" value="' + format.handler + '"' + checkedString + '/>'
+          + format.name + '</label></div>',
+    });
+    choicesContainer.appendChild(row);
+  }
+
+  return typeDiv;
+};
+
+GraphicsExportPanel.prototype.getSubmapId = function() {
+  var self = this;
+  var div = $("div[name='modelSelectDiv']", $(self.getElement()))[0];
+  var id = null;
+  $(":checked", $(div)).each(function(index, element) {
+    id = element.value;
+  });
+  return id;
+};
+GraphicsExportPanel.prototype.getFormatHandler = function() {
+  var self = this;
+  var div = $("div[name='formatSelectDiv']", $(self.getElement()))[0];
+  var format = null;
+  $(":checked", $(div)).each(function(index, element) {
+    format = element.value;
+  });
+  return format;
+};
+
+GraphicsExportPanel.prototype._createDownloadButton = function() {
+  var self = this;
+  var downloadDiv = Functions.createElement({
+    type : "div",
+    name : "downloadDiv",
+    style : "clear:both; padding: 10px;",
+  });
+  var button = Functions.createElement({
+    type : "button",
+    name : "downloadButton",
+    content : " Download",
+    onclick : function() {
+      var identifier = null;
+      var defaultOverlayName = "Network";
+      for (var i = 0; i < self.getProject().getModel().getLayouts().length; i++) {
+        var layout = self.getProject().getModel().getLayouts()[i];
+        if (identifier === null || layout.getName() === defaultOverlayName) {
+          identifier = layout.getId();
+        }
+      }
+
+      return ServerConnector.getImageDownloadUrl({
+        modelId : self.getSubmapId(),
+        backgroundOverlayId : identifier,
+        handlerClass : self.getFormatHandler(),
+      }).then(function(url) {
+        return self.downloadFile(url);
+      }).then(null, GuiConnector.error);
+    },
+  });
+  downloadDiv.appendChild(button);
 
+  return downloadDiv;
 };
 
 module.exports = GraphicsExportPanel;