Create a gist now

Instantly share code, notes, and snippets.

What would you like to do?
Prototype of resizable SVG images
OutputArea.prototype.append_svg = function (svg, element) {
var toinsert = $("<div/>").addClass("box-flex1 output_subarea output_svg");
// The <svg> tag cannot be made resizable so we wrap it in a resizable <div>.
// The problem with this is that we need to 1) set the initial size of the
// <div> based on the size of the <svg> and 2) we need to tie the size of the
// <div> and the <svg>.
var img = $('<div/>');
svg = img.find('svg');
// The width and height returned here will be a string with units. Any units
// could be used and there is no way to reliably compute the equivalent pixels.
// Because of this the calls to width and height below simply pass on the unit
// information.
var w = svg.attr('width');
var h = svg.attr('height');
// Here we remove the attr versions of the width/height and set the css verions
// that we will be using later in the resize callback.
// We can't pass the minHeight/maxHeight options as they are required to
// be in pixels and we have no way to determining those numbers.
'autoHide': true,
'aspectRatio': true,
'resize': function () {
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment