Der Text des Reporting Services-Diagramms ist verschwommen, wenn er im ReportViewer-Steuerelement auf der Webseite gerendert wird
Problem
Wir erstellen ein Balkendiagramm auf einer Webseite mit einem Reporting Services-Bericht und dem ReportViewer-Steuerelement. Manchmal ist der Text auf dem Diagramm scharf:
Aber die meiste Zeit ist der Text auf der Karte verschwommen:
Was ist los?
Schritte zur Lösung und andere Informationen
- Umfangreiche Suche im Web und SO
- Versuchte verschiedene Browser, Benutzer und Maschinen; konnte Reim oder Grund zur Unschärfe nicht feststellen
- Sie haben mehrere Einstellungen der SSRS-Berichtseigenschaften
DynamicHeightundDynamicWidthversucht - Wenn Sie in Firefox mit der rechten Maustaste auf das Diagrammbild klicken und Bild anzeigen wählen, ist das angezeigte Bild immer scharf
- Das Problem scheint in Charts mit einer Umrandung stärker ausgeprägt zu sein. Rand auf Diagramm entfernt, aber Problem bleibt
Betrifft Browser
- Firefox 15.0
- Chrome 23.0.1271.97 m
- IE 9 aber nur im Browser-Modus = IE9, Document Mode = IE9 Standards
Umgebung
- Visual Studio 2010 Pro
- .NET 4.0
- IIS 7.0
- Reporting Services 2008
- ReportViewer-Steuerungsversion 10
3 Antworten
Ursache
Das ReportViewer-Steuerelement gibt Diagramme als PNG-Bild aus. Der ReportViewer fügt dem CSS für das Bild die Eigenschaften width , height und min-width hinzu. Diese CSS-Eigenschaften bewirken, dass das Bild im Browser auf eine etwas kleinere Größe skaliert wird. Die Bildskalierung verursacht die beobachtete Unschärfe.
Auflösung
Das Problem wurde in unserer Umgebung behoben, indem zusätzliches CSS verwendet wurde, um mehrere vom ReportViewer gerenderte CSS-Eigenschaften zu überschreiben. Das Reporting Services-Diagramm erhält in BIDS ein spezielles Tag, sodass ein CSS-Selektor das betroffene Bild finden kann.
Schritt 1. Geben Sie dem Diagramm einen eindeutigen Wert für seine Eigenschaft ToolTip :
(Der eindeutige Wert in diesem Beispiel ist MyOfficeChart .)
Wenn das Diagramm als <img> dargestellt wird, werden die Attribute <img> und alt des title -Tags auf diesen Wert gesetzt.
Schritt 2. Erstellen Sie CSS, um <img> durch den eindeutigen Wert des Attributs title zu wählen und überschreiben Sie das verursachende CSS:
Diese Schritte lösen das Problem für alle Browser und Benutzer und ob das Diagramm einen Rahmen hat oder nicht.
Eine einfache Lösung bestand darin, ein Rechteck direkt in Ihre Tablix-Zelle zu setzen und dann das Diagramm innerhalb dieses Rechtecks zu platzieren. (Anstatt das Diagramm direkt in der Tablix-Zelle zu haben.)
Nicht 100% sicher, warum es funktioniert ... aber es funktioniert.
Dies ist keine richtige Lösung, könnte aber helfen. Die Schritte sind wie folgt:
- Öffnen Sie die Berichts-ID im Berichtsgenerator
- Wählen Sie den Text des Diagramms, der unscharf wird
- Geben Sie im Schriftstil "C" (im obersten Menü) ein und drücken Sie die Eingabetaste
- Schriftart ändert sich, aber unbekannt
- Versuche zu laufen und den Unterschied zu sehen
Tags und Links asp.net reporting-services reportviewer