Zum Inhalt springen

Javascript verändert Größe von Zeichenfläche in Illustrator

Von Null auf ... Javascript in Illustrator – eine kurze, einfache Einführung, Teil 08, Die Größe der Zeichenfläche bzw. des Dokuments ändern.

(Info:) (<neu>) Im achten Artikel »Javascript verändert Größe von Zeichenfläche in Illustrator« erfahren Sie in einem Tutorial Von Null auf …, wie Sie mit wenigen Javascript-Befehlen die Größe einer Zeichenfläche, und damit die Größe eines Dokuments in Adobe Illustrator 2022 verändern können. Dieser Artikel funktioniert auch mit älteren Versionen von (AI:).

(Tipp:) Wenn Sie noch nicht mit Javascript vertraut sind, dann lesen Sie zuerst die Artikel »Illustrator mit Javascript automatisieren«.

Inhaltsverzeichnis

Adobe ExtendScript

Das Scripting (Programmierung) in Adobe Illustrator basiert auf Adobe ExtendScript, eine Abart von ECMAScript 3, kurz ES3, und ist somit ein Dialekt von Javascript. Die Dateiendung eines Adobe ExtendScript ist ».jsx«. Trotzdem spricht man auch bei den Adobe Programmen von Javascripts. Javascripts haben übrigens die Endung ».js«.

Manuell die Größe der Zeichenfläche verändern

Es gibt in Adobe Illustrator drei Möglichkeiten, um die Größe der Zeichenfläche (Artboard) zu verändern: über »Dokument einrichten«, mithilfe des Fensters »Zeichenfläche« oder über das Werkzeug »Zeichenfläche.
(Hinweis:) Beachten Sie, dass ein Adobe Illustrator Dokument mehr als eine Zeichenfläche enthalten kann. Hier im Tutorial Von Null auf … hat das Dokument genau eine Zeichenfläche.

Das Dokument einrichten

(A:) Rufen Sie den Menübefehl »Datei > Dokument einrichten…« auf.

(B:) Klicken Sie dann auf die Schaltfläche »Zeichenfläche bearbeiten«.

Von Null auf ... Javascript in Illustrator – eine kurze, einfache Einführung, Teil 08, Die Größe der Zeichenfläche bzw. des Dokuments ändern.
Zeichenfläche bearbeiten in »Dokument einrichten«.

(C:) Wählen Sie nun auf dem Pop-Menü (links oben) den gewünschten Befehl, hier »An Bildmaterialbegrenzungen anpassen«. Dadurch passen Sie die Zeichenfläche genau an die Elemente im Illustrator-Dokument an. Alternativ können Sie die Größe der Zeichenfläche auch mit der Maus durch Drag and Drop verändern oder oben in der Leiste Position (x, y) sowie Breite und Höhe der Zeichenfläche nummerisch anpassen.

Von Null auf ... Javascript in Illustrator – eine kurze, einfache Einführung, Teil 08, Die Größe der Zeichenfläche bzw. des Dokuments ändern.
Die Zeichenfläche genau auf die Größe bringen, die die Elemente in der Grafik einnehmen.

Die Zeichenfläche bearbeiten

(A:) Rufen Sie den Menübefehl »Fenster > Zeichenfläche« auf oder klicken Sie das Icon in den Bedienfeldern an.

(B:) Im Fenster »Zeichenfläche« klicken Sie auf das rechte Icon. Es erscheint ein neues Fenster.

(C:) Im Fenster »Zeichenflächenoptionen« wählen Sie unter »Vorg(aben)« nun statt »A4« die gewünschte Größe, wie »An Bildmaterialbegrenzungen anpassen«, oder tragen Breite, Höhe und Position (x, y) nummerisch ein.

Von Null auf ... Javascript in Illustrator – eine kurze, einfache Einführung, Teil 08, Die Größe der Zeichenfläche bzw. des Dokuments ändern.
Die Zeichenfläche über das Fenster »Zeichenfläche« bearbeiten.

Das Werkzeug »Zeichenfläche«

(Tipp:) Am schnellsten geht es mit dem Werkzeug »Zeichenfläche«.

(A:) Wählen Sie aus das Werkzeug »Zeichenfläche« aus oder drücken Sie die Tastenkombination <SHIFT><O> (Umschalttaste und Groß-O).

(B:) Wählen Sie nun auf dem Pop-Menü (links oben) den gewünschten Befehl, hier »An Bildmaterialbegrenzungen anpassen«. Dadurch passen Sie die Zeichenfläche genau an die Elemente im Illustrator-Dokument an. Alternativ können Sie die Größe der Zeichenfläche auch mit der Maus durch Drag and Drop verändern oder oben in der Leiste Position (x, y) sowie Breite und Höhe der Zeichenfläche nummerisch anpassen.

Von Null auf ... Javascript in Illustrator – eine kurze, einfache Einführung, Teil 08, Die Größe der Zeichenfläche bzw. des Dokuments ändern.
Das Werkzeug »Zeichenfläche« in Adobe Illustrator.

Javascript verändert Größe von Zeichenfläche in Illustrator

In ExtendScript (Javascript) in Adobe Illustrator gibt es für die Zeichenflächen (Artboards) eine Reihe von Eigenschaften und Methoden.

Die Größe der ersten Zeichenfläche anzeigen lassen

// show size of the first artboard
var vArtboard = app.activeDocument.artboards[0]; // (A:)
alert(vArtboard.artboardRect); // (B:)

(A:) Mit var vArtboard = app.activeDocument.artboards[0]; können Sie die erste Zeichenfläche auswählen. (Hinweis:) In Javascript beginnt das Zählen von Objekten immer mit der 0 (Null).

(B:) Wenn Sie mit alert(vArtboard.artboardRect); sich die Größe der Zeichenfläche anzeigen lassen, dann wird dies immer in Pixel »px« angezeigt.

Von Null auf ... Javascript in Illustrator – eine kurze, einfache Einführung, Teil 08, Die Größe der Zeichenfläche bzw. des Dokuments ändern.
Ergebnis des kleinen Javascripts zum Anzeigen der Größe der ersten Zeichenfläche.

(C:) Wenn Sie im Werkzeug »Zeichenfläche« die Zeichenfläche in den Punkt »x: 0px« und »y: 0px« verschieben und anschließend das kleine Javascript zum Anzeigen der Größe der ersten Zeichenflächen aufrufen.

(D:) Dann erhalten Sie unter macOS (mit Intel-Prozessor) die Werte »0,0,910,-606.00000000008«.
(Hinweis:) Um diese vielen, nutzlosen Nachkommastellen zu vermeiden, sollten Sie die Zahlen runden. Dies Problem tritt nur auf, wenn Sie die Datei in Millimetern oder einer anderen Einheit statt Pixel angelegt hatte und sich nun die Größe in Pixeln (px) betrachten.

Die Größe der Zeichenfläche auf zwei Kommastellen gerundet

// show size of the first artboard, version 2
var vArtboard = app.activeDocument.artboards[0]; 
var vRect = vArtboard.artboardRect; 
for (var i = 0; i < 4; i++) {vRect[i] = vRect[i].toFixed(2); } // (E:)
alert ("gerundete Größe: " + vRect);

(E:) Die Zeile geht alle vier Werte für die Zeichenfläche durch und rundet diese auf zwei Kommastellen genau.

Von Null auf ... Javascript in Illustrator – eine kurze, einfache Einführung, Teil 08, Die Größe der Zeichenfläche bzw. des Dokuments ändern.
Das Ergebnis mit gerundeten Zahlen.

Die Größe aus der Position der Zeichenfläche berechnen

(Hinweis:) Die Eigenschaften .artboardRect gibt in Pixel die Position der linken oberen Ecke und der rechten unteren Ecke aus. Daher muss die Größe durch die Differenz der Positionszahlen ermittelt werden:

// show size of the first artboard, version 3
var vArtboard = app.activeDocument.artboards[0]; 
var vRect = vArtboard.artboardRect; 
for (var i = 0; i < 4; i++) {vRect[i] = Math.abs(vRect[i].toFixed(2)); } // (F:)
var vWidth = vRect[2] - vRect[0]; // (G:)
var vHeight = vRect[3] - vRect[1]; // (H:)
alert("Breite: " + vWidth + " und Höhe: " + vHeight + " px");

(F:) Weil die Koordinaten der Zeichenfläche auch negativ sein können, müssen zur Berechnung von Breite und Höhe die Zahlen durch Math.abs() in absolute (positive) Zahlen umgewandelt werden.

(G:) Die Breite wird aus dem Werten .artboardRect[2] - .artboardRect[0] berechnet, hier 910 – 0 = 910 px.

(H:) analog wird die Höhe aus .artboardRect[3] - .artboardRect[1] berechnet, hier 606 – 0 = 606 px.

Von Null auf ... Javascript in Illustrator – eine kurze, einfache Einführung, Teil 08, Die Größe der Zeichenfläche bzw. des Dokuments ändern.
Die Breite und Höhe der Zeichenfläche mit einem Javascript berechnen.

Die Größe der Zeichen mit einem Javascript verändern

Die Eigenschaft .artboardRect kann auch dazu benutzt werden, die Größe der Zeichenfläche zu verändern, Stichwort: resize artboard. Um die Größe der aktuellen Zeichenfläche zu ändern, nutzen Sie am besten eine Funktion, die Sie dann immer wieder benutzen bzw. aufrufen können, wenn sie diese brauchen. Damit es kein Chaos in der Darstellung bei mehreren Zeichenflächen gibt, sollte die Zeichenfläche, die verändert wird, in der gleichen Position bleiben.

//change artboard size
function changeCurrentArtboardSize(size){ // (A:)
  var vAAI = activeDocument.artboards.getActiveArtboardIndex(); // (B:)
  var vArtboard = activeDocument.artboards[vAAI];
  var newWidth = new UnitValue (size[0], "px"); // (C:)
  var newHeight = new UnitValue (size[1], "px");
  var x = vArtboard.artboardRect[0]; // (D:)
  var y = vArtboard.artboardRect[1];
  newWidth = x + newWidth.as("px");
  newHeight = y - newHeight.as("px"); // (E:)
  vArtboard.artboardRect = [x,y,newWidth,newHeight]; // (F:)
} //end of function
// main script
changeCurrentArtboardSize([640,480]); // (A:)

(A:) Die Funktion changeCurrentArtboardSize wird mit einem Zahlenpaar, hier [640,480], aufgerufen.

(B:) Die Variable vAAI enthält die Indexnummer des aktiven Artboards.

(C:) Das Zahlenpaar wird in „px“ umgerechnet. Alternativ können Sie auch eine andere Einheit wie „mm“ verwenden und die Zahlen werden umgerechnet.

(D:) Die linke obere Ecke (x, y) wird ermittelt.

(E:) Die neue Breite und Höhe wird mit der Position der linken oberen Ecke addiert, bzw. subtrahiert, da die Y-Werte in AI negativ nach unten laufen.

(F:) Der Zeichenfläche werden die vier neuen Positionzahlen zugewiesen.

Die Zeichenfläche an die Größe der Elemente auf der Zeichenfläche per Javascript anpassen

Ein Javascript verändert Größe von Zeichenfläche in Illustrator nicht nummerisch, sondern orientiert sich an der Größe der Elemente orientieren, die auf dieser ganz oder teilweise liegen. Dabei bleibt die Zeichenfläche auf der alten Position.

//change artboard size
function adjustCurrentArtboard(){ // (A:)
  var vAAI = activeDocument.artboards.getActiveArtboardIndex(); 
  var vArtboard = activeDocument.artboards[vAAI];
  var vPos = vArtboard.artboardRect; // (B:)
  var vItems = activeDocument.selectObjectsOnActiveArtboard(); // (C:)
  app.executeMenuCommand('group'); // (D:)
  activeDocument.selection[0].position = [vPos[0],vPos[1]];
  app.executeMenuCommand('ungroup');
  activeDocument.fitArtboardToSelectedArt(vAAI); // (E:)
} //end of function
// main script
alert("Start");
adjustCurrentArtboard(); // (A:)

(A:) Die Funktion adjustCurrentArtboard() wird ohne Parameter aufgerufen.

(B:) Es wird die Position der Zeichenfläche festgestellt.

(C:) Alle Elemente, die ganz oder teilweise auf der aktiven Zeichenflächen liegen, werden ausgewählt.

(D:) Anschließend wird die Auswahl als Gruppe auf die Position (links oben) der Zeichenfläche verschoben. Danach wird die Gruppe wieder aufgehoben.

(E:) Die aktive Zeichenfläche wird an die Auswahl der Elemente angepasst.

Fazit

In Adobe Illustrator wird die Größe der Arbeitsfläche über die Größe der Zeichenfläche bestimmt. Es gibt drei Möglichkeiten, dies von Hand zu machen. In ExtendScript (Javascript) können Sie eine einfache Funktion schreiben, um die Größe der aktuellen Zeichenfläche zu verändern. Es kann die Zeichenfläche an die Elemente, die auf ihr liegen angepasst werden, oder nummerisch in Position (x, y) sowie Breite und Höhe angepasst werden.

ENDE

(Hilfe:) Wenn Sie eine Funktion in (AI:), (PS:), (IC:), (ID:) oder (FM:) benötigen, jedoch nicht selbst programmieren, dann sprechen Sie mich an. Ich übernehme gerne kleine Aufträge: zum Kontaktformular.

Jetzt sind Sie gefragt!

(FAQ:) Klicken Sie auf den Link »Kontakt«, wenn Sie eine Anregung, Ergänzung oder einen Fehler gefunden haben.

(Hinweis:) Klicken Sie auf den Link »Newsletter«, wenn Sie gerne auf dem Laufenden bleiben wollen.

(Hilfe:) Klicken Sie auf den Link »Spende«, wenn Sie die Website mit einer kleinen Zuwendung unterstützen möchten.