2015-10-08 8 views
5

Was ist die korrekte Syntax, um ein ViewBox-Attribut eines SVG-Elements mit vordefinierten Werten zu liefern? Ich habe dies:snap svg: Ändern Sie ViewBox mit Parametern

var mySvg=Snap("#mySvg"); 
    var worldMap=mySvg.select("#worldMap");//worldMap is an svg inside svg 

, wenn ich dies versucht:

worldMap.attr({viewBox:"760, 455, 132, 78"}); 

es funktioniert gut. Aber wenn ich es mit Parametern versuchte:

var x=760; 
var y=455; 
var wi=132; 
var hi=78; 

worldMap.attr({viewBox:"x, y, wi, hi"); 

nichts passiert ist, warum? Ich glaube, das Problem besteht darin, die richtige Syntax zu finden. Ich habe auch versucht:

worldMap.attr({viewBox:x, y, wi, hi); 
worldMap.attr({viewBox:{x, y, wi, hi}); 
worldMap.attr({viewBox:(x, y, wi, hi)); 
worldMap.attr({viewBox:[x, y, wi, hi]); 

nichts funktioniert so weit ... irgendeinen Vorschlag?

Antwort

3

verketten Sie Ihre Werte und Ihre Trennzeichen (,) als eine Zeichenfolge. Versuchen Sie es, es sollte funktionieren.

worldMap.attr({viewBox:x+","+y+","+wi+","+hi}); 
+0

Denke nie daran, danke Holger, es war hilfreich. – Rickard

2

Sie können auch verwenden:

worldMap.attr({viewBox:[x,y,wi,hi].join(',')}); 
worldMap.attr({viewBox:[x,y,wi,hi].join(' ')}); 

es ist besser lesbar

Edit: in meiner ersten Antwort, die ich mit gebrauchtem Beitritt '', aber in MDN Tutorial Definition ist mit Platz char ''