2013-04-02 3 views
5

먼저 이미지 처리에 익숙하지 않았기 때문에 내 말씨가 꺼져 있으면 실례합니다.캔버스와 자바 스크립트를 사용하여 다각형 표현을위한 이미지 샘플링을위한 알고리즘?

HTML5 캔버스에 떨어 뜨린 이미지를 샘플링하고 샘플링 한 후 샘플링을 줄인 다음 다른 대부분의 삼각형이있는 대부분 삼각형을 사용하여 이미지의 다각형 표현을 만들고 이미지를 그려 넣으려고합니다. 캔버스.

하지만 알고리즘을 어디에서 시작해야할지 모르겠다. 이런 종류의 알고리즘에는 어떤 종류의 의사 코드가 필요합니까?

http://oi49.tinypic.com/1hcj2d.jpg

+1

이 작업을 수행하는 라이브러리가 있어야합니다 ... 이것은 자주 필요한 작업입니다. 따라서 비트 맵 이미지에 대한 몇 가지 유형의 벡터 추적을 수행하려는 것 같습니다. –

+0

http://stackoverflow.com/questions/3038905/how-can-i-convert-simple-shape-bitmap-to-vector-geometry –

+0

과 밀접하게 관련되어 있습니다. 귀하의 질문을 더 잘 이해하려고합니다. "Pointillism"이미지를 생성하는 방법을 묻는 중 점이 아닌 삼각형을 사용하고 있습니까? – markE

답변

5

나는 다음을 수행합니다 :

  1. 은 무작위로 배치 점의 필드를 작성합니다.
  2. 점으로부터 Voronoi diagram을 만듭니다.
  3. 컬러 색상을 샘플링을 기반으로 각 셀.
    • 점에서 색상을 선택하나요? 셀 내의 모든 색상을 샘플링하고 평균을 계산합니까? 셀의 중심에 평균을 가중합니까? 각각은 서로 다르지만 흥미로운 결과를 만들어 낼 것입니다.

결과는 삼각형이 아닌 다각형, 다음 대신 보로 노이 다이어그램 Delaunay triangulation을 생성 할 필요가있는 경우 . GitHub에는 15 JavaScript libraries for this이 있지만 특별히 추천 할 수있는 것은 하나도 없습니다.

+1

+1. 이것은 무작위로 분포 된 도트를 사용하여 무작위로 크기가 지정된 다각형으로 끝나기는하지만 유망한 접근법처럼 들립니다. 결과 이미지는 원래 이미지를 색상으로 만 나타내며 양식으로는 표현하지 못할 수 있습니다. –

+0

교육적! 고마워. –

+0

Voronoi와 Delaunay 삼각 측량 정보를 찾고 있었는데, 시작 지점이 없었습니다. – ars265

4

좋아, 그것은 조금 간접적이지만 간다 ..... :

이 이미지는 최종 결과에 대한 이해를 제공 할 수 있습니다! https://github.com/gsmith85/SeuratJS/blob/master/seurat.js

여기에 흥미로운 부분입니다 :

은 pointilized 예술로 이미지를 전환 SVG를위한 플러그인입니다. 후드 아래는 캔버스 캔버스을 사용하여 처리합니다!

이 예제는 "도트"와 "사각형"으로 구성된 이미지를 보여줍니다.

아마도 삼각형을 만들기 위해 사각형을 자르더라도 삼각형을 생성하도록 코드를 수정할 수 있습니다.

+0

재미있는 라이브러리, 나는 더 자세히 살펴보고 내가 생각하는 방식으로 이미지를 조작 할 수 있는지 알아 보겠습니다. 감사. – ars265

관련 문제