Conver highchart to SVG - svg

Question

I want to convert below chart to SVG so that I can export it to PDF/PPT along with other contents.
click here to see the demo chart
I know I have highchart export, but I can't use it since I have something else apart from chart and html2canvas is not an option because of some security reasons.
function _getDiamondGraphLabel(head, body, lvl, positionLeft, primeColor) {
var positionedTopClass = '',
headFormatted = '',
bodyFormatted = '',
positionedLeftClass = '';
if (lvl) {
positionedTopClass = 'diamond-graph-label-lvl-' + lvl;
}
if (positionLeft) {
positionedLeftClass = 'diamond-graph-label-left';
}
headFormatted = '<div class="diamond-graph-head-label">' + head + '</div>';
bodyFormatted = '<div class="diamond-graph-body-label"><b>' + body + '</b></div>';
var retVal = '<div ' + (primeColor ? 'style="border-color: ' + primeColor + '; border-width: 3px"' : '') + ' class="diamond-graph-label ' +
positionedTopClass + ' ' + positionedLeftClass + '""><div class="diamond-graph-label-content" ' +
(primeColor ? 'style="background-color: ' + primeColor + ' ; color: white"' : '') + '>' + headFormatted + bodyFormatted + '</div></div>';
return retVal;
}
var min = 49560,
per10 = 49560,
per25 = 63560,
per75 = 102537,
per90 = 119537,
median = 83362,
average = 89142,
max = 119537,
counter = 0;
var tickerPositions = [min, per10, per25, per75, per90, median, average, max];
chart = new Highcharts.Chart({
chart: {
renderTo: 'container',
type: 'columnrange',
inverted: true,
plotBackgroundColor: '#e9e9e9',
height: 25,
plotHeight: 60,
width: $('#container')[0].clientWidth,
spacing: [0, 0, 0, 0]
},
title: {
text: ''
},
xAxis: {
tickLength: 0,
labels: {
enabled: false
}
},
yAxis: {
tickPositions: tickerPositions,
labels: {
useHTML: true,
formatter: function () {
// There is a bug in Highcharts that formatter is calling twice. (reset if the value is higher than tickers length)
if (counter >= tickerPositions.length) {
counter = 0;
}
counter++;
switch (counter) {
case 2:
return _getDiamondGraphLabel('10th', this.value, 0, false, '#000');
case 3:
return _getDiamondGraphLabel('25th', this.value, 1, false, '#000');
case 4:
return _getDiamondGraphLabel('75th', this.value, 1, true, '#000');
case 5:
return _getDiamondGraphLabel('90th', this.value, 0, true, '#000');
case 6:
return _getDiamondGraphLabel("Median", this.value, 2, average < median, "#000");
case 7:
return _getDiamondGraphLabel("Average", this.value, 2, average > median, '#000');
default:
return '<div></div>';
}
}
},
title: {
text: null
}
},
legend: {
enabled: false
},
tooltip: {
enabled: false
},
exporting: {
enabled: false
},
credits: {
enabled: false
},
plotOptions: {
columnrange: {
grouping: false,
borderWidth: 0,
pointPadding: 0,
groupPadding: 0
}
},
series: [{
name: 'MinTo10th',
stack: 'DIAMOND_STACK',
data: [{
x: 0,
low: min,
high: per10
}],
color: '#ebebeb'
}, {
name: '10thTo25th',
stack: 'DIAMOND_STACK',
data: [{
x: 0,
low: per10,
high: per25
}],
color: '#bbbbbb'
}, {
name: '25thTo75th',
stack: 'DIAMOND_STACK',
data: [{
x: 0,
low: per25,
high: per75
}],
color: '#6a6a6a'
}, {
name: '75thTo90th',
stack: 'DIAMOND_STACK',
data: [{
x: 0,
low: per75,
high: per90
}],
color: '#bbbbbb'
}, {
name: '90thToMax',
stack: 'DIAMOND_STACK',
data: [{
x: 0,
low: per90,
high: max
}],
color: '#ebebeb'
}, {
name: 'median',
stack: 'DIAMOND_STACK',
data: [{
x: 0,
low: median,
high: median + 1
}],
color: '#1a8099'
}, {
name: 'average',
stack: 'DIAMOND_STACK',
data: [{
x: 0,
low: average,
high: average + 1
}],
color: '#006699'
}]
});
Can somebody help me with it.
Thanks in advance.