EDYTOWAĆ:

W końcu znalazłem sposób na erodowanie i rozszerzanie wielokątów (przesunięcie), dzięki czemu nowa geometria jest tworzona przy użyciu biblioteki Clipper:https://sourceforge.net/projects/jsclipper/

Demo JavaScript Clipper na żywo:http://jsclipper.sourceforge.net/5.0.2.1/main_demo.html

Clipper może obsługiwać tylko wielokąty lub wieloboki (np. Wielokąty z otworami), więc aby działał z innymi obiektami graficznymi w formacie SVG, muszą zostać przekonwertowane na linie proste. Co najmniej ścieżki są dość łatwe do przekonwertowania na liniepath.getTotalLength() ipath.getPointAtLength() (http://whaticode.com/2012/02/01/converting-svg-paths-to-polygons/).

Inną możliwością jest użycie podobnej techniki (która nie tworzy nowej geometrii):https://stackoverflow.com/a/12723835/1691517

Czy jest jakiś sposób na erodowanie i rozszerzanie kształtów w SVG za pomocą Javascript?

Mam następujący przykład SVG:http://jsfiddle.net/timo2012/2S4Kt/1/

Istnieją trzy kształty: niebieski jest oryginalny, zielony jest zerodowany (rozcieńczony), a czerwony jest rozszerzony (pogrubiony). Są tworzone w Illustratorze.

Przetestowałem erodowanie i rozszerzanie filtrów, ale efekt nie jest tak dobry:https://dvcs.w3.org/hg/FXTF/raw-file/tip/filters/examples/feMorphology.svg

Po kilku godzinach przeszukiwania Internetu znalazłem tylko przykłady erozji i rozszerzania obrazu bitmapowego, ale nic o kształtach wektorowych.

Udało mi się rozszerzyć i zniszczyć wielokąty SVG za pomocą Shapely (http://toblerity.github.com/shapely/manual.html ) w Pythonie wysyłając punkty ścieżki za pomocą wywołania Ajax do skryptu PHP, który wywołuje system () do skryptu Pythona, ale ta metoda jest powolna i wymaga serwera do wykonania pracy, którą można wykonać po stronie klienta.

To jest mój kod do rozszerzania i erodowania w Pythonie (jak widzisz, jest on dość krótki):

#!/usr/bin/python26

from shapely.geometry import Polygon
from shapely.geometry import MultiPolygon

import sys

if len(sys.argv)>2:
  inset=eval(sys.argv[1])
  coords=eval(sys.argv[2])
else:
  sys.exit()

bowtie = Polygon(coords)
clean = bowtie.buffer(inset)
clean = clean.simplify(1, preserve_topology=False)
if clean.length>0:
  if clean.geom_type=="MultiPolygon":
    for n in range(0, len(clean)):
      print list(clean[n].exterior.coords)
      #print "\n"
  elif clean.geom_type=="Polygon":
    print list(clean.exterior.coords)

Znajdź także ten dokument, który próbuje zdefiniować rozszerzanie i erodowanie w kategoriach matematycznych:http://en.wikipedia.org/wiki/Mathematical_morphology

Jest zdanie „Podstawową ideą morfologii binarnej jest próbkowanie obrazu o prostym, wstępnie zdefiniowanym kształcie, wyciąganie wniosków na temat tego, jak ten kształt pasuje lub pomija kształty na obrazie. Ta prosta„ sonda ”nazywa się elementem strukturyzującym, i sam jest obrazem binarnym (tj. podzbiorem przestrzeni lub siatki). ”

Zakładam, że ta metoda może być użyta w morfingu kształtów wektorowych, ale jak ...

EDYCJA: Jeden komentarz w odpowiedzi spowodował możliwość użycia filtrów zamiast tworzenia nowej geometrii: jeśli ktoś chce dodać uchwyty przeciągania do punktów wielokąta, wtedy uchwyty przeciągania mogą wydawać się być w niewłaściwym miejscu. Może to być akceptowalne, ponieważ wtedy wydaje się, że oryginalne dane ścieżki są nietknięte, co w rzeczywistości ma miejsce w przypadku filtrów, ale - po dalszych testach - udowodniło, że jakość jest większym problemem. Wedługto ito Filtr SVG wykorzystuje pikselową reprezentację obiektu grafiki wektorowej zamiast samych danych ścieżki, co prowadzi doniezbyt dobre wyniki.

EDIT2: MOŻLIWY DZIAŁANIE: Jedna z odpowiedzi na tej stronie skłoniła mnie do użycia obrysów i maski o zmiennej szerokości, aby uzyskać dobrze wyglądające obejście tego problemu. Zrobiłem kilka testów i zaimplementowałemefekt przesunięcia ścieżki podobny do Adobe Illustratora.