we created an HTML5 page that has svg images and on click, svg should be scaled using JavaScript (scale), we also created a qt based web browser, on Chromium and qt 4.8.5 web browser the svg images scale correctly but using the same qt based web browser with qt 5.2.1 the svg images look blurry, as in the attached screen shots.

this is the JavaScript part for the scaling

currentGauge.animate(

{ margin: '-32 0 0 -275px' }

, 'slow');

currentGauge.animate(

{ tempScaler: 2 }

, {
step: function(now, fx)

{ now = now + 1; $(this).css('-webkit-transform', "scale(" + now + "," + now + ")"); }

,
complete: function()

{ console.log("Scale done" + currentGauge.css("margin")); scaleInProgress = false; }

}, 'linear');
} else {
scaleInProgress = true;
scaledGauge = false;
currentGauge.animate(

{ tempScaler: 2 }

, {
step: function(now, fx)

{ var ajustedNow = 3 - now; $(this).css('-webkit-transform', "scale(" + ajustedNow + "," + ajustedNow + ")"); }

,
duration: 'slow'
}, 'linear');

currentGauge.animate(

{ 'margin-top': orginalMarginTop, 'margin-right': originalMarginRight, 'margin-bottom': originalMarginBottom, 'margin-left': originalMarginLeft }

, 'slow', function()

{ $(".gauge_box").show(); console.log("Scale done"); scaleInProgress = false; }

);

}
}