프로그래밍 방식으로 방사형 도트 행 만들기


17

다음과 같이 스피커 구멍 패턴을 만들고 싶습니다. 여기에 이미지 설명을 입력하십시오

그러나 어디서부터 시작 해야할지 모르겠습니다. Illustrator 또는 유사한 소프트웨어에서 힘든 위치를 지정하지 않고도이를 달성 할 수 있습니까?


Python과 같은 것을 사용하여 올바르게 위치 / 크기가 지정된 점이있는 SVG를 만든 다음 Illustrator에서 SVG를 열고 .ai로 다시 저장 한 다음 그 곳으로 이동하는 것이 쉽지 않습니다.
Superbest

사소한 것이 맞습니다. 극좌표 대 직교 변환을 작성한 다음 중첩 루프, 한 스텝핑 반경 및 다른 스텝핑 각도를 작성하십시오. 귀하의 예에서 각도 단계는 9도 또는 PI / 10입니다.
Peter Wone

답변:


9

가장 간단한 것처럼 보이기 때문에 내 방법을 추가하겠습니다. 기본적으로 당신은 :

  1. 파이썬으로 계산 원을 생성
  2. 간단한 SVG 파일로 렌더링
  3. Illustrator에서 파일 열기

다음은 Python 스크립트입니다 ( svgwrite및 필수 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())

디렉토리에 SVG 파일이 생성됩니다. 브라우저에서 파일을 열 수 있습니다.

여기에 이미지 설명을 입력하십시오

또는 Illustrator에서 :

여기에 이미지 설명을 입력하십시오

그래도 나보다 큰 Illustrator 창을 사용해야하지만 내 작업이 너무 작아서 편안하게 작업 할 수 없습니다 ...

파이썬 스크립트가 파일을 만들 수 없다면 (온라인 파이썬 인터프리터 에서이 파일을 실행할 수 있음) 간단히 주석 처리하십시오 dwg.save(). 마지막 줄은 SVG의 내용을 콘솔에 인쇄합니다.이 내용을 메모장에 붙여 넣은 다음 다른 이름으로 저장하십시오 my file.svg.

나는 쫓겨 났고 다음과 같은 몇 가지 "정밀한"기능을 추가했다.

  • 브라우저에서 볼 때 음의 좌표를 가진 원이 잘리지 않도록 원이 올바르게 가운데에 오도록합니다.
  • SVG 캔버스 크기를 조정하십시오.

Illustrator에서는 캔바스 경계 외부의 객체를 숨기지 않고 수동으로 캔바스의 크기를 조정할 수 있으므로 이러한 항목을 쉽게 제거 할 수 있습니다.

여기에 이미지 설명을 입력하십시오


16

실제로 이미지가 TK에서 직접 생성 한 것인지 아닌지를 지정하지 않습니다. 이 코드가 이미 있으면 TK 응용 프로그램 캔버스를 EPS로 내보내고 Illustrator에서 열 수 있습니다. 전화하면 canvas.postscript()됩니다.

TK를 사용하려면

파이썬 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()

이 이름의 파일이 생성됩니다 "patten.eps".

pattern.eps의 결과

이미지 1 : 일러스트 레이터에서 생성 된 EPS를 엽니 다.

extendScript, SVG 또는 EPS 프로그램을 작성하여 쉽게 수행 할 수 있습니다 (일부 예제는 아래 부록 참조). 리소스에 대해서는 다음 게시물을 참조하십시오.

추신 : 회전 도구와 Ctrl+D

Illustrator의 파라 메트릭 혼합

  1. 원을 그립니다.
  2. 그것을 복제하십시오.
  3. 원을 혼합
  4. 척추를 나타내는 다른 원을 그리고 한 점으로 자릅니다
  5. 블렌드와 원을 모두 선택하고 오브젝트 → 블렌드 → 스파인 교체
  6. Object → Blend → Blend Options ... 에서 하나의 개체를 빼서 구체 수를 조정하십시오 .
  7. Spne Circle 크기 및 옵션을 복사하고 조정하십시오. 끝난

하나의 반지

이미지 2 : 위의 방법으로 하나의 링


부록 1 : 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

부록 2 : ExtendScript 예제

#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);
}

고마워-나는 tk 윈도우가 없다, 그것은 내가 찾은 패턴의 예일 뿐이다
Tom

1
@Tom 그 이유는 대안을 나열한 이유입니다.
joojaa

1
Hah 굉장합니다. PostScript가 Turing complete라는 곳을 읽었지만 실제로 코드를 작성한 사람을 본 적이 없습니다.
Peter Wone

9

당신이 경우 하지 않는 서서 점에 대해 신경 ...

점선을 사용하여 Illustrator에서 예제와 유사한 것을 빠르게 만들 수 있습니다. 균일 한 간격의 링을 쉽게 그리려면 Polar Grid Tool을 사용합니다 .

극좌표 그리드 도구 옵션 극좌표 그리드 도구 결과

그런 다음 링의 스트로크를 취향에 맞는 간격으로 점선으로 설정하면됩니다.

획 패널 옵션 도트를 방사

물론 각 행을 미세 조정하여 필요한 경우 더 많은 점을 추가하고 개별 간격 값을 늘리거나 줄일 수 있습니다. 간격 상자가 활성화 된 상태에서 스크롤 휠을 사용하여 값을 빠르게 변경할 수 있습니다. Ctrl / Cmd미세한 증분으로 조정하려면 스크롤하는 동안 누르고 있습니다

획 패널 옵션 도트를 방사

이 방법의 문제점은 일부 점에 약간의 겹침이있을 수 있다는 것입니다.

도트 겹침

완벽하게하려면 수동으로 편집해야 할 수도 있습니다. 행당 최대 1 개의 겹침이 있어야합니다.


1
좋은 것, 혼합은 거친 정렬에 더 좋습니다
joojaa

1
스피커 그릴입니다. 알루미늄으로 실크 스크린을 만들고 각 마크를 수동으로 뚫습니다.이 경우 약간 넓은 마크는 중요하지 않거나 DXF로 변환하고 CNC 밀을 사용합니다.이 경우 약간 넓은 구멍은 중요하지 않습니다.
Peter Wone

9

당신이 경우에 점들이 일렬로 늘어서에 대해주의를 ...

Illustrator의 왜곡 및 변형 효과는 이러한 종류의 반복 패턴에 적합하지만 정확한 패턴을 얻으려면 약간의 조정이 필요합니다. 점선으로 시작하십시오 (예를 들어 11 개의 점으로)

스트로크 옵션 창 점선

를 통해 변형 효과 추가 Effect > Distort & Transform > Transform...

변형 효과 옵션 도트를 방사

내부 행에 점이 너무 많습니다. 여기에서 수동 조정이 이루어 지지만 나머지는 알아낼 수있을만큼 멀어 질 것입니다.


8

잉크 스케이프 사용 :

  1. 동심원 안내선을 작성하고 선을 두 번 클릭하여 같은 양으로 회전합니다 (30도 사용).
  2. 너비와 높이를 수동으로 설정하고 중심으로 이동하는 일련의 동심원 채워지지 않은 원을 만듭니다.
  3. 채워진 원을 만들고 몇 번 복사하여 붙여 넣습니다.
  4. "행 및 열"도구를 사용하여 간격을 동일하게하여 행을 따라 펼치십시오.
  5. 원을 그룹화 한 다음 회전시킵니다. 마지막으로 중심이 가이드 교차점과 정렬되도록 배치하십시오.
  6. 다시 복사하여 붙여 넣습니다.

여기에 이미지 설명을 입력하십시오

그리고 결과 (OP의 이미지와 일치하도록 22.5도 사용) :

여기에 이미지 설명을 입력하십시오

당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.