2012-05-16 10 views
8

Mam zdefiniowany element SVG o szerokości i wysokości "297 mm" i "210 mm", bez widoku. Robię to, ponieważ chcę pracować wewnątrz rzutni A4, ale chcę tworzyć elementy w pikselach.Skalowanie obiektów SVG zdefiniowanych w pikselach do jednostek fizycznych?

W pewnym momencie muszę skalować obiekt zdefiniowany w pikselach, aby pasował do części strony A4. Na przykład, mogę mieć obiekt o szerokości 100 pikseli, który chcę skalować do 30 mm w poziomie.

Czy to możliwe? Myślę, że potrzebuję drugiego kontenera z nowym układem współrzędnych, ale nie mogę znaleźć żadnego sposobu, aby to zrobić.

EDIT

Wydaje się, że ja (lub SVG) został niezrozumiany co piksel jest. Zdałem sobie sprawę, że mogę ustawić linię na 100%, a następnie uzyskać jej rozmiar w pikselach z getBBox, aby znaleźć wymagane skalowanie. Napisałem ten kod i prowadził ją na 2 klientów, jeden z monitorem 1280x1024 (80dpi) i jedno z 1680x1050 LCD (90dpi):

function getDotsPerInch() { 
    var hgroup, vgroup, hdpi, vdpi; 

    hgroup = svgDocument.createElementNS(svgNS, "g"); 
    vgroup = svgDocument.createElementNS(svgNS, "g"); 
    svgRoot.appendChild(hgroup); 
    svgRoot.appendChild(vgroup); 

    drawLine(hgroup, 0, 100, "100%", 100, "#202020", 1, 1); 
    drawLine(vgroup, 100, 0, 100, "100%", "#202020", 1, 1); 

    hdpi = hgroup.getBBox().width * 25.4/WIDTH; 
    vdpi = vgroup.getBBox().height * 25.4/HEIGHT; 

    drawText(hgroup, "DPI, horizontal: " + hdpi.toFixed(2), 100, 100); 
    drawText(hgroup, "DPI, vertical: " + vdpi.toFixed(2), 100, 120); 
} 

IE9, FF, Opera i Chrome są zgodni, że oba monitory Są one wyświetlane w pionie i poziomie (chociaż operacja jest nieco niedokładna), a Safari zgłasza 0 dpi na obu monitorach. Tak więc svg po prostu określił "piksele" jako "96dpi". wydaje się, że niektórzy szybcy Googling potwierdzają to, chociaż nie znalazłem nic ostatecznego, a większość trafień daje 90dpi, z 96dpi jako wariantem FF.

+1

Dlaczego niektórzy uważają, że to wymaga zamknięcia? –

+0

Wow - to pytanie ma rok, podnosi ważną kwestię dotyczącą definicji dpi dla SVG, jest wyraźnie związane z SVG i pokazuje pewne wysiłki badawcze. Mimo to 5 osób właśnie zdecydowało się zamknąć to zadanie jako nietypowe, a ktoś po prostu nie głosował. Czy ktoś chce wyjaśnić? – EML

+0

A jeden z nich ma 16 lat i żaden z nich nie wydaje się być zainteresowany SVG ... – EML

Odpowiedz

0

Można zagnieździć elementy <svg> i użyć atrybutu viewBox elementu potomnego, aby uzyskać nowy układ współrzędnych. Podaj elementowi x, y, szerokości i wysokości elementu x2, gdzie chcesz, aby pojawił się na rodzicu w układzie współrzędnych rodzica.

+0

Dzięki - w końcu zdałem sobie z tego sprawę, wypróbowałem i doszedłem do wniosku, że jest bezużyteczne. Jeśli ustawię nowy układ współrzędnych z rzutnią ustawioną na szerokość "297 mm", a wysokość na "210 mm", a pole widoku ustawi się na "0 0 297 210", a następnie (1), jeśli dodasz rozmiar w pikselach obiekt ze starej rzutni do nowej, następnie 'getBBox' w nowej rzutni po prostu zgłasza dokładnie te same wymiary piksela; i (2) jeśli jawnie utworzysz nowy obiekt o rozmiarze "100px", to faktycznie zostanie narysowany jako 100 mm. Jednak wszystko to wydaje się być kwestią dyskusyjną - zobacz moją edycję powyżej. – EML

+0

Przeglądarki zakładają stałą konwersję pikseli na mm, która wynosi 25.4/96.0. Jeśli chcesz konwertować jednostki, możesz określić widok przy użyciu tego współczynnika konwersji. –

+0

@RobertLongson, pomóż eme w tym wydaniu http://stackoverflow.com/questions/15452397/resize-svg-paths-with-physical-mesaurement-unit – Mihir

Powiązane problemy