2016-09-19 4 views
0

Ich benutze D3.js und ich konvertiere die Grafiken in PDF, das Problem ist, dass wenn ich das PDF in Chrome sehe funktioniert es perfekt, aber wenn ich es in Adobe PDF sehe, für Beispiel, die Farbe ist immer schwarz.Farbe bei PDF funktioniert nur in Chrome

Es scheint, dass nur Chrome das Attribut erkennt. Ich habe versucht, ein anderes Attribut zu verwenden, aber es funktioniert nicht.

Es gibt ein Bild von dem, was passiert. Die erste ist das Bild der PDF in Chrome und die zweite ist auf Adobe.

Graphic on PDF in Chrome

Graphic on PDF in Adobe

Hier können Sie das PDF herunterladen und öffnen Sie sie mit Chrome und Adobe, das Problem zu sehen: http://docdro.id/vDluo16

+1

Bieten Sie ein Code-Snippet, so kann ich schauen und Ihnen helfen –

+0

Bitte teilen Sie auch eine Probe Ergebnis pdf zur Analyse. – mkl

+0

@mkl Entschuldigung für die Verzögerung, hier ist das PDF. Sie können es herunterladen und dann versuchen, es mit Chrome und Adobe zu öffnen, Sie werden das Problem sehen. Danke für den Unterschied. –

Antwort

0

Im Folgenden wird beschrieben in dem Ergebnis PDF und warum Chrome interpretiert es ist falsch.

Die Kreisdiagrammsegmente werden gezeichnet, indem ein Pfad mit einer radialen Farbschattierung ausgefüllt wird.

z. Im Falle des größten Segments wird die Schattierung mit dem Namen Sh2 verwendet. Es ist in dem indirekten PDF-Objekt 12 mit Referenzen auf Objekte 13 und 14 definiert:

12 0 obj 
<< 
/ShadingType 3 
/ColorSpace /DeviceRGB 
/Coords [0 0 0 0 0 0] 
/Domain [0 1] 
/Function 13 0 R 
/Extend [true true] 
>> 
13 0 obj 
<< 
/FunctionType 3 
/Domain [0 1] 
/Functions [14 0 R] 
/Bounds [] 
/Encode [0 1] 
>> 
14 0 obj 
<< 
/FunctionType 2 
/Domain [0 1] 
/C0 [1 0.6 0.2] 
/C1 [0 0 0] 
/N 1 
>> 

Betrachten Sie den Coords Array [0 0 0 0 0 0] (die Schraffur der anderen Kreisdiagramm Segmente haben den gleichen Eintrag hier). Es wird als

spezifiziert

Coords Array (Erforderlich) Eine Anordnung von sechs Zahlen [xyrxyr ], die die Zentren und Radien der Anfangs- und Endkreise angeben, ausgedrückt im Koordinatenraum der Schattierung. Die Radien r und r sollen sowohl größer als oder gleich 0. Wenn ein Radius gleich 0 ist, der entsprechende Kreis wird als ein Punkt behandelt werden; Wenn beide 0 sind, soll nichts gemalt werden.

Bei den Schattierungs auf der Hand, wird daher nichts lackiert werden, insbesondere auch nicht in der jeweiligen Ausgangsfarbe (in dem obigen Fall C0[1 0.6 0.2] der Funktion im Objekt definiert 14) des Schattierung jedes Segments.

So ist Chrome PDF-Renderer hier falsch.

Adobe Reader (der alles schwarz malt) ist wahrscheinlich auch hier falsch, aber ich bin nicht 100% sicher, dass es keine Rechtfertigung dafür gibt, alles zu malen, was nicht durch die radiale Schattierung in Schwarz abgedeckt ist.

Höchstwahrscheinlich aber die Vorschau des Beispieldokument auf www.docdroid.net ist korrekt:

preview screenshot


Es bleibt die Frage, warum die Kombination von D3.js und Konvertierung in PDF führt zu diesen unerwünschten Farbdefinitionen. Es könnte ein Problem im Code sein, der die D3.js-Funktionalität aufruft, oder ein Fehler in entweder D3.js oder dem verwendeten Konverter.

Verwandte Themen