Unisci due elementi del percorso svg in modo programmatico

Question

Sto visualizzando una mappa con percorsi SVG (utilizzando jVectormap).

In alcuni casi è necessario unire una regione con la regione adiacente.

Purtroppo entrambe le regioni non si toccano e devo interpolare per riempire lo spazio in mezzo.

jVectormap utilizza tracciati SVG molto semplici con M per impostare il punto iniziale assoluto e l per collegare punti relativi.

Qualcuna delle librerie SVG copre un'operazione del genere?

Answer 1

Questo potrebbe non essere il tipo di risposta che stai cercando, ma utilizzando Raphael.js puoi eseguire il looping su tutta la lunghezza del percorso di una regione getPointAtLength(), confrontandola con tutti i punti della seconda regione. Se le coordinate sono più vicine di n pixel da eventuali coordinate sulla seconda regione e le coordinate precedenti non lo erano, allora potrebbe essere considerato un punto "colla". Dovresti quindi saltare al secondo regio e iniziare a passarci sopra, se il punto successivo è ancora più vicino di n punti, piuttosto che andare nella direzione opposta, se ancora più vicino cambia direzione e vai più lontano lungo il percorso fino a trovare un punto più lontano dalla regione originale rispetto a n pixel. Continua ad andare in quella direzione fino a trovare nuovamente un nuovo punto "colla", dove ancora una volta passerai alla regione originale nel modo descritto e tutti i punti che non sono stati coperti in questo ciclo finale potrebbero essere scartati (o potresti semplicemente crea una nuova forma in base ai punti che hai incontrato mentre giravi per tutta la lunghezza della regione originale

Abbastanza vero, non è la sceneggiatura più semplice da fare, ma dovrebbe essere abbastanza in grado di farlo, specialmente quando tu può usare una funzione come getPointAtLength per trovare i punti tra i punti svg definiti (anche se è necessario solo 'registrare' i punti definiti, e questo è un po 'il percorso difficile in quanto Raphael.js non ha eccitato funzioni che possano aiutare anche questo non dovrebbe essere troppo difficile da eguagliare per mano (in codice di co Urse)).

Answer 2

Non ho provato questo, ma si può aggirare l'ostacolo eseguendo the converter at jVectormap con i seguenti parametri:

--buffer_distance=0 
--where="ISO='region_1' OR ISO='region_2'" 

Dove region_1 e region_2 sono le due regioni che avete bisogno di unire.

Risolvere il problema in questo modo significa anche che i percorsi SVG generati sono fedeli alle coordinate originali, mentre una correzione successiva può portare ad alcune incongruenze (probabilmente minori).