Programmgesteuertes Erstellen strahlender Punktreihen


17

Ich möchte ein Lautsprecherlochmuster wie das folgende erstellen: Bildbeschreibung hier eingeben

Aber ich bin mir nicht sicher, wo ich anfangen soll. Kann dies ohne mühsame Positionierung in Illustrator oder einer ähnlichen Software erreicht werden?


Es wäre trivial, etwas wie Python zu verwenden, um eine SVG-Datei mit richtig positionierten Punkten in der Größe zu erstellen. Öffnen Sie dann die SVG-Datei in Illustrator, speichern Sie sie erneut als .ai und wechseln Sie von dort aus.
Superbest

Trivial ist richtig. Schreiben Sie eine polare in kartesische Transformation, dann verschachtelte Schleifen, einen Schrittradius und den anderen Schrittwinkel. In Ihrem Beispiel beträgt der Winkelschritt 9 Grad oder PI / 10.
Peter Wone

Antworten:


9

Ich werde meine Methode hinzufügen, da sie mir am einfachsten erscheint. Grundsätzlich Sie:

  1. Generieren Sie die Kreise rechnerisch in Python
  2. Rendern Sie sie als einfache SVG-Datei
  3. Datei in Illustrator öffnen

Hier ist das Python-Skript (erfordert svgwriteund math):

"""
This script has two purposes:

- Simple demonstration of using Python (specifically the svgwrite library) to create an SVG file
- Answer the question http://graphicdesign.stackexchange.com/q/56200/21332
"""

# n[x] should give the number of circles at a distance of (x+1)*d from the center
d = 30
n = [8, 16, 20, 20, 20]

r = 7  # radius of each circle

# Calculate the center points of each circle
circles = [(0, 0)]  # There is always one circle in the middle

import math
for i in range(0, len(n)):
    m = n[i]  # m is the number of circle in this "row", i is the number of the row
    for j in range(0, m):  # for each circle...
        phi = 2*math.pi*j/m  # Calculate the angle at which the circle will be

        # Convert polar coordinates to cartesian
        x = d*(i+1)*math.cos(phi)
        y = d*(i+1)*math.sin(phi)

        circles.append((x, y))

# Write circles to SVG
import svgwrite

# Determine correct size of drawing
width = max([c[0] for c in circles])*2.2
height = max([c[1] for c in circles])*2.2

dwg = svgwrite.Drawing('demo.svg', size = (width, height))  # output will be in the same folder as this script

# offsets for shifting all circles so that the SVG can be easily viewed in browser
x_offset = min([c[0] for c in circles])*1.1
y_offset = min([c[1] for c in circles])*1.1

for c in circles:
    adjusted_x = c[0] - x_offset
    adjusted_y = c[1] - y_offset

    dwg.add(svgwrite.shapes.Circle((adjusted_x, adjusted_y), r))

# Save the file
dwg.save()

# Print SVG source to console
print(dwg.tostring())

Es wird eine SVG-Datei in dem Verzeichnis erstellt, in dem es sich befindet. Sie können dies in einem Browser öffnen:

Bildbeschreibung hier eingeben

Oder in Illustrator:

Bildbeschreibung hier eingeben

Sie sollten ein größeres Illustrator-Fenster als ich verwenden, meins war jedoch etwas zu klein, um bequem zu arbeiten ...

Wenn Sie mit Python-Skripten keine Dateien erstellen können (möglicherweise in einem Online-Python-Interpreter), kommentieren Sie diese einfach aus dwg.save(). In der letzten Zeile wird der Inhalt der SVG-Datei in die Konsole gedruckt. Sie können ihn in den Editor einfügen und dann speichern unter my file.svg.

Ich wurde mitgerissen und fügte ein paar "nette" Funktionen hinzu, wie:

  • Stellen Sie sicher, dass die Kreise richtig zentriert sind, damit Kreise mit negativen Koordinaten beim Anzeigen in Ihrem Browser nicht abgeschnitten werden.
  • Ändern Sie die Größe der SVG-Zeichenfläche.

Sie können diese leicht weglassen, da Illustrator Objekte außerhalb der Zeichenbereichsgrenzen nicht versteckt und Sie die Größe des Zeichenbereichs manuell ändern können:

Bildbeschreibung hier eingeben


16

Sie geben nicht an, ob das Bild etwas ist, das Sie selbst in TK erstellt haben oder zur Hand haben oder nicht. Wenn Sie diesen Code bereits haben, können Sie die Zeichenfläche der TK-Anwendungen als EPS exportieren und im Illustrator öffnen. Sie brauchen nur anzurufen canvas.postscript().

Wenn Sie TK verwenden möchten

Einfaches Beispiel in Python 2:

#!/usr/bin/python
# -*- coding: utf-8 -*-

from Tkinter import *
import math

def circle(c, x, y, r=10):
    return c.create_oval(x-r, y-r, x+r, y+r, width=0, fill="black")

def draw_circles(c, num, r):
    step = (2.0*math.pi)/float(num)
    for i in range(num):
        x = 400 + r * math.sin(i*step)
        y = 400 + r * math.cos(i*step)
        circle(c, x, y)


main_window = Tk()
main_window.title('Pattern to EPS')
canvas = Canvas(main_window,
                    width=800, height=800, 
                    bg = 'white')

circle(canvas, 400, 400)
for i in range(1, 6):
    draw_circles(canvas, i*8, i*60)

canvas.pack()

# next line generates a eps file
canvas.postscript(file = "pattern.eps",  width=800, height=800 )

# uncomment next line if you want to see the tk window
# main_window.mainloop()

Dies führt zu einer Datei mit dem Namen "patten.eps".

Ergebnis von pattern.eps

Bild 1 : Öffnen des erzeugten EPS im Illustrator.

Sie können dies in extendScript, SVG oder direkt tun, indem Sie das EPS-Programm schreiben, was alle einfach zu tun ist (siehe Anhang unten für einige Beispiele). In den folgenden Beiträgen finden Sie Ressourcen:

PS : Ich weiß nicht, ob es sich lohnt, ein Skript zu schreiben, da es ungefähr 3 Minuten dauert, um sie mit Hilfe des Drehwerkzeugs und Ctrl+ zu zeichnenD

Parametrische Überblendung in Illustrator

  1. Zeichne einen Kreis.
  2. dupliziere es.
  3. Vermische die Kreise
  4. Zeichnen Sie einen weiteren Kreis, der die Wirbelsäule darstellt, und schneiden Sie ihn an einer Stelle ab
  5. Wählen Sie sowohl Überblendung als auch Kreis aus und führen Sie Objekt → Überblendung → Wirbelsäule ersetzen aus
  6. Passen Sie die Anzahl der Kugeln mit Objekt → Überblenden → Überblendungsoptionen ... minus einem Objekt an.
  7. Kopieren Sie die Größe der Kreise und passen Sie sie an. erledigt

ein Ring

Bild 2 : Ein Ring mit der obigen Methode


Anlage 1: Mit manuell geschriebenem EPS

%!PS-Adobe-3.0 EPSF-3.0
%%BoundingBox: 0 0 800 800
%%Title: pattern
%%Creator: joojaa
%%CreationDate:  2015-07-08
%%EndComments

/c {newpath 10 0 360 arc closepath fill} def
/cr {
    dup 8 mul 2 dict begin /i exch def /r exch 60 mul def 
    1 1 i {360 i div mul dup sin exch cos r mul exch r mul c} for 
    end
} def

400 400 translate
0 0 c
1 1 6 {cr} for
%%EOF

Anhang 2: ExtendScript-Beispiel

#target illustrator

var doc = app.activeDocument; 

function circle(x,y) {
    doc.pathItems.ellipse(x+5,y-5,10,10);
}

function draw_circles(num, r){
    var step = (2.0*Math.PI)/num;
    for (var i = 0; i < num; i++) {
        var x = -200 + r * Math.sin(i*step);
        var y = 200 + r * Math.cos(i*step);
        circle(x, y);
    }
}

circle(-200,200);
for (var i = 1; i <= 6; i++) {
    draw_circles(i*8, i*30);
}

Danke - ich habe kein tk-Fenster, es war nur ein Beispiel für das Muster, das ich gefunden habe
Tom

1
@ Tom Deshalb habe ich Alternativen aufgelistet.
Joojaa

1
Hah, das ist großartig. Ich habe irgendwo gelesen, dass PostScript vollständig ist, aber ich habe noch nie jemanden gesehen, der tatsächlich darin programmiert hat.
Peter Wone

9

Wenn Sie sich nicht für die Punkte interessieren, die ausrichten ...

Mit einem gestrichelten Strich können Sie schnell etwas Ähnliches wie in Ihrem Beispiel in Illustrator erstellen. Um die gleichmäßig verteilten Ringe einfach zu zeichnen, würde ich das Polar Grid Tool verwenden .

Optionen des Polar Grid-Werkzeugs Polar Grid Tool Ergebnis

Dann müssen Sie nur noch den Strich an den Ringen so einstellen, dass er mit Lücken versehen ist, die Ihren Wünschen entsprechen:

Strichbedienfeld-Optionen strahlende Punktreihen

Sie können natürlich jede Zeile fein abstimmen, um bei Bedarf weitere Punkte hinzuzufügen. Erhöhen oder verringern Sie einfach den einzelnen Lückenwert. Wenn das Lückenfeld aktiv ist, können Sie den Wert mit dem Mausrad schnell ändern. Halten Sie Ctrl / Cmddie Taste gedrückt, während Sie scrollen, um die Einstellung in kleineren Schritten vorzunehmen

Strichbedienfeld-Optionen strahlende Punktreihen

Ein Problem bei dieser Methode ist, dass einige der Punkte möglicherweise überlappen:

Punktüberlappung

Diese müssen möglicherweise manuell bearbeitet werden, wenn sie perfekt sein sollen. Es sollte höchstens 1 Überlappung pro Reihe geben.


1
Gut, Mischung ist besser für die Ausrichtung hart
Joojaa

1
Es ist ein Lautsprechergitter, entweder er wird es auf Aluminium siebdrucken und manuell durch jede Markierung bohren, in welchem ​​Fall eine geringfügig breite Markierung keine Rolle spielt, oder er wird auf DXF konvertieren und eine CNC-Fräse verwenden, in welchem ​​Fall eine geringfügig breites Loch spielt keine Rolle.
Peter Wone

9

Wenn Sie tun , kümmern uns um die Punkte Schlange ...

Der Verzerrungs- und Transformationseffekt von Illustrator ist perfekt für diese Art von sich wiederholenden Mustern, aber um genau dieses Muster zu erhalten, müssen einige Anpassungen vorgenommen werden. Beginnen Sie mit einer gepunkteten Linie (mit 11 Punkten für Ihr Beispiel)

Bereich für Konturoptionen Gepunktete Linie

Fügen Sie über einen Transformationseffekt hinzu Effect > Distort & Transform > Transform...

Optionen für den Transformationseffekt strahlende Punktreihen

Sie werden feststellen, dass die inneren Zeilen zu viele Punkte haben. Hier kommt die manuelle Optimierung ins Spiel, aber das sollte Sie weit genug bringen, um den Rest herauszufinden.


8

Verwenden Sie Inkscape:

  1. Erstellen Sie kozentrische Hilfslinien und doppelklicken Sie auf die Linien, um sie um den gleichen Betrag zu drehen (ich habe 30 Grad verwendet).
  2. Erstellen Sie eine Reihe von exzentrischen ungefüllten Kreisen, indem Sie die Breite und Höhe manuell einstellen und sie in die Mitte verschieben.
  3. Erstellen Sie einen gefüllten Kreis und kopieren Sie ihn mehrmals.
  4. Verwenden Sie das Werkzeug "Zeilen und Spalten", um sie mit gleichem Abstand entlang einer Zeile zu verteilen
  5. Gruppieren Sie die Kreise und drehen Sie sie dann. Platzieren Sie sie schließlich so, dass die Mitte mit dem Schnittpunkt der Hilfslinien übereinstimmt.
  6. Kopieren und erneut einfügen.

Bildbeschreibung hier eingeben

Und das Ergebnis (unter Verwendung von 22,5 Grad, um mit dem Bild des OP übereinzustimmen):

Bildbeschreibung hier eingeben

Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.