I'm trying to draw an SVG image using HTML5 and inline svg tag.
On a PC all elements are shown right, when I use my iPad some elements disappear.
See the code below:
<svg id="mimic_id" width="750" height="600" viewBox="0 0 750 600" xmlns="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/1999/xhtml" xmlns:xlink="http://www.w3.org/1999/xlink">
<defs>
<path transform="rotate(-20,120,120)" d="M -7,0 c 0 -7 14 -7 14 0 c -2 -2 -10 -2 -180 0" id="ButtonOnHighlight" style="fill:url(#linearOnGradientGlowWhite); stroke:none" />
<linearGradient id="linearGradientWhite">
<stop id="stop3032" style="stop-color:#ffffff;stop-opacity:1" offset="0" />
<stop id="stop3034" style="stop-color:#ffffff;stop-opacity:0" offset="1" />
</linearGradient>
<linearGradient id="linearLedGradientBlack">
<stop id="stop3163" style="stop-color:#000000;stop-opacity:0" offset="0.15" />
<stop id="stop3161" style="stop-color:#000000;stop-opacity:0.33" offset="1" />
</linearGradient>
<linearGradient x1="0" y1="-70" x2="0" y2="0" id="linearLedGradientGlowWhite" xlink:href="#linearGradientWhite" gradientUnits="userSpaceOnUse" />
<radialGradient cx="0" cy="0" r="80" fx="20" fy="20" id="linearLedGradientGlowBlack" xlink:href="#linearLedGradientBlack" gradientUnits="userSpaceOnUse" />
<g id="Led" transform="scale (0.1)">
<circle id="LedBase" cx="0" cy="0" r="70" />
<circle id="LedGlow" cx="0" cy="0" r="70" style="fill:url(#linearLedGradientGlowBlack);stroke:none" />
<path transform="rotate(-60,0,0)" d="M -65,0 c 0,-85 130,-85 130,0 c -20,-20 -110,-20 -130,0" id="fillLedHighlight" style="fill:url(#linearLedGradientGlowWhite); stroke:none" />
</g>
<g id="bottom_piston" style="fill:#aaa; stroke: black; stroke-width:1px;">
<rect x="0" y="0" height="5" width="90" />
<rect x="42" y="5" height="50" width="4" />
</g>
<g id="top_piston" style="fill:#aaa; stroke: black; stroke-width:1px;">
<rect x="42" y="0" height="50" width="4" />
<rect x="0" y="50" height="5" width="90" />
</g>
<g id="th_flap" style="fill:#aaa; stroke: #000; stroke-width:1px;">
<rect x="0" y="0" height="35" width="3" />
<circle cx="2" cy="40" r="5" />
<path d="M 3 6 l 7 0 s 10 0 0 12 l -7 0" />
<circle cx="9" cy="12" r="3" />
</g>
<g id="bh_flap" style="fill:#aaa; stroke: #000; stroke-width:1px;">
<rect x="0" y="0" height="46" width="3" />
<circle cx="2" cy="0" r="5" />
<path d="M 3 39 l 7 0 s 10 0 0 -12 l -7 0" />
<circle cx="9" cy="33" r="3" />
</g>
<g id="flap_piston" style="fill:#aaa; stroke: #000; stroke-width:1px;">
<rect x="0" y="0" width="55" height="4" />
<circle cx="0" cy="2" r="4" />
</g>
<g id="link_piston" style="fill:#aaa; stroke: #000; stroke-width:1px;">
<rect x="0" y="0" width="25" height="4" />
</g>
</defs>
<use id="M_DO" xlink:href="#Led" x="180" y="360" data-tav-animation-fillcolor-expr="[M_DO]" data-tav-animation-fillcolor-param="'fillOff';'fillGreen'" data-tav-label="Led" name="M_DO" />
<use id="BS_PISTON" xlink:href="#bottom_piston" x="265" y="344" data-tav-animation-translateY-expr="[M_TS]" data-tav-animation-translateY-param="0;0;1;15;1000" name="bottom_piston_translate_Y" />
<use id="TS_PISTON" xlink:href="#top_piston" x="265" y="160" data-tav-animation-translateY-expr="[M_TS]" data-tav-animation-translateY-param="0;0;1;-15;1000" name="top_piston_translate_Y" />
<g id="TH_FLAP_OBJ">
<g id="tras_TH_FLAP_LINK" name="tras_TH_FLAP_LINK" data-tav-animation-translateX-expr="[M_TH]" data-tav-animation-translateX-param="0;0;1;-50;2000">
<use id="TH_FLAP_LINK" xlink:href="#link_piston" x="470" y="198" data-tav-animation-rotate-expr="[M_TH]" data-tav-animation-rotate-param="495;200;0;0;1;-77;2400" name="top_flap_link" />
</g>
<!-- -->
<use id="TH_FLAP_PISTON" xlink:href="#flap_piston" x="495" y="198" data-tav-animation-translateX-expr="[M_TH]" data-tav-animation-translateX-param="0;0;1;-50;2000" name="top_flap_piston_translate_X" />
<use id="TH_FLAP" xlink:href="#th_flap" x="466" y="188" data-tav-animation-rotate-expr="[M_TH]" data-tav-animation-rotate-param="468;228;0;0;1;-90;2000" name="top_flap_rotate" />
</g>
<g id="BH_FLAP_OBJ">
<g id="tras_BH_FLAP_LINK" name="tras_BH_FLAP_LINK" data-tav-animation-translateX-expr="[M_BH]" data-tav-animation-translateX-param="0;0;1;-50;2000">
<use id="BH_FLAP_LINK" xlink:href="#link_piston" x="470" y="358" data-tav-animation-rotate-expr="[M_BH]" data-tav-animation-rotate-param="496;360;0;0;1;68;2300" name="bottom_flap_link" />
</g>
<use id="BH_FLAP_PISTON" xlink:href="#flap_piston" x="495" y="358" data-tav-animation-translateX-expr="[M_BH]" data-tav-animation-translateX-param="0;0;1;-50;2000" name="bottom_flap_piston_translate_X" />
<use id="BH_FLAP" xlink:href="#bh_flap" x="466" y="327" data-tav-animation-rotate-expr="[M_BH]" data-tav-animation-rotate-param="468;327;0;0;1;90;2000" name="bottom_flap_rotate" />
</g>
<g id="resistor" style="stroke: black; stroke-width:1px;" data-tav-animation-fillcolor-expr="[M_HE1]" data-tav-animation-fillcolor-param="'fillOff';'fillRed'" name="RESISTORS">
<rect x="230" y="215" height="7" width="157" />
<rect x="230" y="337" height="7" width="157" />
<rect x="230" y="222" height="115" width="7" />
<rect x="380" y="222" height="115" width="7" />
</g>
Here you can see the fiddle
As you can see (if you've an iPad, I didn't try with an iPhone but I think it will have the same behaviour) with a PC (tested with FF21, Chrome28 and IE10) all elements are shown
With the iPad only the rects in the center of the page are shown, other elements disappear.
I tested it with Safari and Chrome28.
Can you figure out where's the problem?
ATTENTION
With the iOS 7 the problem has been solved. Now all works correctly ;)
<use> breaks on Ipad, it is a browser (user-agent) issue, beyond our control. Two possible solutions:-
Recode the XML tags to avoid <use>
Convert the diagram into a JPG and add it as an <image>
Related
My application displays a Graphviz SVG image representing a chain of subprocesses. I try to add a URL reference on each subprocess to display its details:
business_process_controller.rb
def show
### Retrieved by Callback function
# Generate graphviz
graph = GraphViz.new( :G, :type => :digraph )
#business_process.activities.order(:sort_code).each do |node|
case node.node_type.code
when 'START'
node_color = 'blue'
when 'END'
node_color = 'green'
when 'RESCUE'
node_color = 'red'
else
node_color = 'black'
end
graph.add_node(node.code, URL: activity_path(node.id), color: node_color)
end
#business_process.activities.order(:sort_code).each do |node|
if node.success_next
graph.add_edge(node.code, node.success_next.code)
end
if node.failure_next
graph.add_edge(node.code, node.failure_next.code).color = 'red'
end
end
graph.output(svg: "app/assets/images/temporary_images/#{#business_process.class.name}_flow#{#business_process.id}.svg")
end
The image is then displayed using an image_tag:
<div class="row">
<div align="center" class="col-md-12">
<%= image_tag("temporary_images/#{this_object.class.name}_flow#{this_object.id}.svg") %>
</div>
</div>
But even though the URL links are correctly generated in the SVG file, they are not active in the displayed page.
<g id="a_node1"><a xlink:href="/subprocess/12362" xlink:title="TRT_INTIALISATION">
How to display the SVG image so that hyperlinks are active in the web page?
Thanks for you help!
The generated SVG file:
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<!-- Generated by graphviz version 2.49.0 (20210828.1703)
-->
<!-- Title: G Pages: 1 -->
<svg width="338pt" height="116pt"
viewBox="0.00 0.00 337.99 116.00" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g id="graph0" class="graph" transform="scale(1 1) rotate(0) translate(4 112)">
<title>G</title>
<polygon fill="white" stroke="transparent" points="-4,4 -4,-112 333.99,-112 333.99,4 -4,4"/>
<!-- TRT_INTIALISATION -->
<g id="node1" class="node">
<title>TRT_INTIALISATION</title>
<g id="a_node1"><a xlink:href="/subprocess/12362" xlink:title="TRT_INTIALISATION">
<ellipse fill="none" stroke="blue" cx="179.94" cy="-90" rx="100.18" ry="18"/>
<text text-anchor="middle" x="179.94" y="-86.3" font-family="Times New Roman,serif" font-size="14.00">TRT_INTIALISATION</text>
</a>
</g>
</g>
<!-- TRT_SAS_SCRIPTS -->
<g id="node2" class="node">
<title>TRT_SAS_SCRIPTS</title>
<g id="a_node2"><a xlink:href="/subprocess/12349" xlink:title="TRT_SAS_SCRIPTS">
<ellipse fill="none" stroke="black" cx="92.94" cy="-18" rx="92.88" ry="18"/>
<text text-anchor="middle" x="92.94" y="-14.3" font-family="Times New Roman,serif" font-size="14.00">TRT_SAS_SCRIPTS</text>
</a>
</g>
</g>
<!-- TRT_INTIALISATION->TRT_SAS_SCRIPTS -->
<g id="edge1" class="edge">
<title>TRT_INTIALISATION->TRT_SAS_SCRIPTS</title>
<path fill="none" stroke="black" d="M158.88,-72.05C147.77,-63.11 133.96,-52.01 121.86,-42.27"/>
<polygon fill="black" stroke="black" points="123.79,-39.33 113.81,-35.79 119.41,-44.78 123.79,-39.33"/>
</g>
<!-- TRT_FINISH -->
<g id="node3" class="node">
<title>TRT_FINISH</title>
<g id="a_node3"><a xlink:href="/subprocess/12363" xlink:title="TRT_FINISH">
<ellipse fill="none" stroke="green" cx="266.94" cy="-18" rx="63.09" ry="18"/>
<text text-anchor="middle" x="266.94" y="-14.3" font-family="Times New Roman,serif" font-size="14.00">TRT_FINISH</text>
</a>
</g>
</g>
<!-- TRT_INTIALISATION->TRT_FINISH -->
<g id="edge2" class="edge">
<title>TRT_INTIALISATION->TRT_FINISH</title>
<path fill="none" stroke="red" d="M201,-72.05C212.28,-62.98 226.33,-51.68 238.56,-41.84"/>
<polygon fill="red" stroke="red" points="241.08,-44.3 246.67,-35.31 236.69,-38.85 241.08,-44.3"/>
</g>
</g>
</svg>
I'm trying to get a gooey effect with svg. Things are fine in chrome, but look weird on Safari & iOS. Here is the example: https://codepen.io/rubenhak/project/editor/ZoBENL
How it looks on Chrome:
How it looks on Safari/iOS:
The problem is when the one circle is too far, too small or missing, the other circle gets bulged. None of this is an issue on chrome.
Code:
<svg version="1.1" xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
viewBox="0 0 500 200" width="500" height="200">
<defs>
<filter id="goo" color-interpolation-filters="sRGB">
<feGaussianBlur in="SourceGraphic" stdDeviation="8" result="blur" />
<feColorMatrix in="blur" mode="matrix" values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 21 -7" result="cm" />
</filter>
</defs>
<g >
<circle fill="green" r="15" cx="30" cy="95" />
</g>
<g filter="url(#goo)">
<circle fill="blue" r="30" cx="80" cy="50" />
<circle fill="green" r="15" cx="80" cy="95" />
</g>
<g filter="url(#goo)">
<circle fill="blue" r="20" cx="160" cy="50" />
<circle fill="green" r="15" cx="160" cy="95" />
</g>
<g filter="url(#goo)">
<circle fill="blue" r="20" cx="220" cy="60" />
<circle fill="green" r="15" cx="220" cy="95" />
</g>
<g filter="url(#goo)">
<circle fill="blue" r="20" cx="300" cy="50" />
<circle fill="green" r="15" cx="300" cy="95" />
</g>
<g filter="url(#goo)">
<circle fill="blue" r="10" cx="350" cy="50" />
<circle fill="green" r="15" cx="350" cy="95" />
</g>
<g filter="url(#goo)">
<circle fill="green" r="15" cx="400" cy="95" />
</g>
<g >
<circle fill="green" r="15" cx="450" cy="95" />
</g>
</svg>
Safari is clipping the output of the feGaussianBlur to the default filter region before handing it to the feColorMatrix. Chrome doesn't do that. You can fix it by expanding the default filter region.
<filter id="goo" x="-50%" width="200%" y="-50%" height="200%" color-interpolation-filters="sRGB">
I have my code below, basically to print out an image.
private async void imageControl_PrintButtonClick(object sender, RoutedEventArgs e)
{
var createBitmapTask = Task.Run(async () =>
{
var stream = await provider.OpenEntryAsRandomAccessStreamAsync(currentImageFile);
var decoder = await BitmapDecoder.CreateAsync(stream);
return await decoder.GetSoftwareBitmapAsync(
BitmapPixelFormat.Bgra8,
BitmapAlphaMode.Premultiplied);
});
var printHelper = new PrintHelper(printPanel);
printHelper.OnPreviewPagesCreated += PrintHelper_OnPreviewPagesCreated;
printPanel.Opacity = 1.0;
var source = new SoftwareBitmapSource();
var bitmap = await createBitmapTask;
await source.SetBitmapAsync(bitmap);
printImage.Source = source;
printFileName.Text = "Hello";
printImage.Height = bitmap.PixelHeight;
printImage.Width = bitmap.PixelWidth;
await printHelper.ShowPrintUIAsync("ZipPicView - " + currentImageFile.ExtractFilename(), true);
printPanel.Opacity = 0;
}
private void PrintHelper_OnPreviewPagesCreated(List<FrameworkElement> obj)
{
ContentDialog dialog = new ContentDialog();
}
However, the print preview shows an empty page. When I print it out, the printer does nothing.
I've tried changing the opacity of the printPanel (which is a Grid object) to non-zero, and the image does display on the screen. Still, the print has nothing on the output page.
I did notice that, on the OnPreviewPagesCreated, its obj parameter has a new object everytime it's called. The first call has one object with both Width and Height as NaN. My guess is because the container has no size, it cannot determine the content size.
Below is the XAML file.
<Page x:Name="page"
x:Class="ZipPicViewUWP.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:ZipPicViewUWP"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:interactivity="using:Microsoft.Xaml.Interactivity"
xmlns:behaviors="using:Microsoft.Toolkit.Uwp.UI.Animations.Behaviors"
mc:Ignorable="d" KeyUp="page_KeyUp" Loaded="page_Loaded" SizeChanged="page_SizeChanged">
<Canvas x:Name="canvas" SizeChanged="canvas_SizeChanged">
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}" Height="1019" Width="1920">
<Grid x:Name="printPanel" Opacity="0">
<StackPanel x:Name="printContent"
Margin="0,0"
Orientation="Vertical">
<TextBlock x:Name="printFileName" />
<Image x:Name="printImage"
Stretch="Fill" />
</StackPanel>
</Grid>
<SplitView x:Name="splitView" DisplayMode="CompactOverlay" PanePlacement="Left" CompactPaneLength="50" OpenPaneLength="300">
<SplitView.Content>
<GridView x:Name="thumbnailGrid" />
</SplitView.Content>
<SplitView.Pane>
<Grid Background="{StaticResource SidebarBackground}">
<Grid.RowDefinitions>
<RowDefinition Height="50" />
<RowDefinition Height="*" />
<RowDefinition Height="50" />
</Grid.RowDefinitions>
<StackPanel Orientation="Horizontal" Grid.Row="0">
<Button x:Name="subFolderButton" Width="50" Height="50" Background="Transparent" Click="subFolderButton_Click">
<SymbolIcon Symbol="List" />
</Button>
<TextBlock VerticalAlignment="Center" Margin="0,15">Folders</TextBlock>
</StackPanel>
<ScrollViewer Grid.Row="1">
<ListView x:Name="subFolderListCtrl" SelectionChanged="subFolderList_SelectionChanged" DataFetchSize="2" Margin="-10,0,0,0" />
</ScrollViewer>
<ProgressRing x:Name="thumbProgress" Height="30" Width="30" HorizontalAlignment="Left" VerticalAlignment="Center" Grid.Row="2" Margin="10,0,0,10" />
</Grid>
</SplitView.Pane>
</SplitView>
<interactivity:Interaction.Behaviors>
<behaviors:Blur x:Name="BlurBehavior" Duration="500" AutomaticallyStart="False" />
</interactivity:Interaction.Behaviors>
</Grid>
<Border x:Name="imageBorder" Visibility="Collapsed">
<Image x:Name="image" ManipulationMode="TranslateX" ManipulationCompleted="image_ManipulationCompleted" Tapped="image_Tapped">
<interactivity:Interaction.Behaviors>
<behaviors:Blur x:Name="ImageTransitionBehavior" Duration="500" AutomaticallyStart="False" />
</interactivity:Interaction.Behaviors>
</Image>
</Border>
<local:ViewerControl x:Name="imageControl" Visibility="Collapsed" CloseButtonClick="imageControl_CloseButtonClick" NextButtonClick="imageControl_NextButtonClick" PrevButtonClick="imageControl_PrevButtonClick" SaveButtonClick="imageControl_SaveButtonClick" PrintButtonClick="imageControl_PrintButtonClick" />
<Border x:Name="loadingBorder" Visibility="Collapsed">
<ProgressRing IsActive="True" Width="100" Height="100" />
</Border>
</Canvas>
<Page.TopAppBar>
<CommandBar VerticalContentAlignment="Center" VerticalAlignment="Center">
<CommandBar.Content>
<TextBlock Margin="10,0,0,0" x:Name="filenameTextBlock" Text="<None>" UseLayoutRounding="True" />
</CommandBar.Content>
<AppBarToggleButton x:Name="fullscreenButton" Icon="FullScreen" Label="FullScreen" Checked="fullscreenButton_Checked" Unchecked="fullscreenButton_Unchecked" />
<AppBarSeparator />
<AppBarButton x:Name="openFileButton" Icon="OpenFile" Label="Open File" Click="openFileButton_Click" />
<AppBarButton x:Name="openFolderButton" Icon="Folder" Label="Open Folder" Click="openFolderButton_Click" />
</CommandBar>
</Page.TopAppBar>
</Page>
And the source code is here : https://github.com/wutipong/ZipPicViewCS/tree/master/ZipPicViewUWP
Could someone please help me out on printing data as per user timezone. We have a scenario where the user will pass the timezone and based upon that the value should return. I found the way to modify the date parameters as per user passed time zone and get the result from database. But after that how should I write the data in there time zone. Do I need to convert individual date columns to be printed on there time zone or any other way is there to convert once as per there time zone and print all values.
Let me tell you we trying to implement this on existing reports, so we are looking for a process for least changes.
Please find the source code for a sample report.
<?xml version="1.0" encoding="UTF-8"?>
<!-- Created with Jaspersoft Studio version 6.2.0.final using JasperReports Library version 6.2.0 -->
<!-- 2017-02-27T18:40:31 -->
<jasperReport xmlns="http://jasperreports.sourceforge.net/jasperreports" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://jasperreports.sourceforge.net/jasperreports http://jasperreports.sourceforge.net/xsd/jasperreport.xsd" name="TimeZoneQuery" pageWidth="842" pageHeight="595" orientation="Landscape" whenNoDataType="NoDataSection" columnWidth="842" leftMargin="0" rightMargin="0" topMargin="0" bottomMargin="0" isIgnorePagination="true" uuid="6af36fbc-520f-436a-a8b5-1510d55e7474">
<property name="ireport.zoom" value="1.0"/>
<property name="ireport.x" value="0"/>
<property name="ireport.y" value="0"/>
<property name="com.jaspersoft.studio.data.sql.tables" value=""/>
<style name="column header" mode="Opaque" forecolor="#000000" backcolor="#D2D2D2" fill="Solid" vTextAlign="Middle" vImageAlign="Middle" fontName="Tahoma" fontSize="11" isBold="true" isItalic="false" isUnderline="false" isStrikeThrough="false">
<box>
<topPen lineWidth="0.25" lineStyle="Solid" lineColor="#979991"/>
<leftPen lineWidth="0.25" lineStyle="Solid" lineColor="#979991"/>
<bottomPen lineWidth="0.25" lineStyle="Solid" lineColor="#979991"/>
<rightPen lineWidth="0.25" lineStyle="Solid" lineColor="#979991"/>
</box>
</style>
<style name="detail" forecolor="#000000" fill="Solid" vTextAlign="Middle" vImageAlign="Middle" fontName="Tahoma" fontSize="11" isBold="false" isItalic="false" isUnderline="false" isStrikeThrough="false">
<box>
<pen lineWidth="0.25" lineColor="#666666"/>
<topPen lineWidth="0.25" lineColor="#979991"/>
<leftPen lineWidth="0.25" lineColor="#979991"/>
<bottomPen lineWidth="0.25" lineColor="#979991"/>
<rightPen lineWidth="0.25" lineColor="#979991"/>
</box>
</style>
<parameter name="FromDate" class="java.lang.String">
<parameterDescription><![CDATA[]]></parameterDescription>
</parameter>
<parameter name="ToDate" class="java.lang.String">
<parameterDescription><![CDATA[]]></parameterDescription>
</parameter>
<parameter name="userTimezone" class="java.lang.String"/>
<parameter name="FromDateTZ" class="java.lang.String" isForPrompting="false">
<defaultValueExpression><![CDATA["'"+$P{REPORT_FORMAT_FACTORY}.createDateFormat("yyyy-MM-dd HH:mm:ss",$P{REPORT_LOCALE}, java.util.TimeZone.getTimeZone($P{userTimezone})).format(new SimpleDateFormat("MM/dd/yyyy HH:mm:ss").parse($P{FromDate}+" 00:00:00'"))+"'"]]></defaultValueExpression>
</parameter>
<parameter name="ToDateTZ" class="java.lang.String" isForPrompting="false">
<defaultValueExpression><![CDATA["'"+$P{REPORT_FORMAT_FACTORY}.createDateFormat("yyyy-MM-dd HH:mm:ss",$P{REPORT_LOCALE}, java.util.TimeZone.getTimeZone($P{userTimezone})).format(new SimpleDateFormat("MM/dd/yyyy HH:mm:ss").parse($P{ToDate}+" 00:00:00'"))+"'"]]></defaultValueExpression>
</parameter>
<parameter name="PrintTZ" class="java.lang.String" isForPrompting="false">
<defaultValueExpression><![CDATA[$P{REPORT_TIME_ZONE}.getTimeZone($P{userTimezone})]]></defaultValueExpression>
</parameter>
<queryString>
<![CDATA[select job.transcribed_date::text,job.created_Date::text, job.delivered_date::text,job.JOB_ID, job.client_facility_iD,job.DICTATION_LENGTH
from DW.job_f job
where job.transcribed_date between to_timestamp( $P!{FromDateTZ} ,'YYYY-MM-DD HH24:MI:SS') and to_timestamp( $P!{ToDateTZ} ,'YYYY-MM-DD HH24:MI:SS')]]>
</queryString>
<field name="transcribed_date" class="java.lang.String"/>
<field name="created_date" class="java.lang.String"/>
<field name="delivered_date" class="java.lang.String"/>
<field name="job_id" class="java.math.BigDecimal"/>
<field name="client_facility_id" class="java.math.BigDecimal"/>
<field name="dictation_length" class="java.math.BigDecimal"/>
<background>
<band splitType="Stretch"/>
</background>
<title>
<band height="120" splitType="Stretch">
<property name="com.jaspersoft.studio.unit.height" value="pixel"/>
<textField>
<reportElement x="0" y="0" width="842" height="30" uuid="68bf2fd7-6d2a-4101-aa84-2f1dc73aa782"/>
<textElement textAlignment="Center" verticalAlignment="Middle">
<font fontName="Tahoma" size="11" isBold="true"/>
</textElement>
<textFieldExpression><![CDATA["Report Header Section"]]></textFieldExpression>
</textField>
<textField>
<reportElement x="0" y="50" width="842" height="20" uuid="7e08b87a-bfd3-4c97-85c2-0495253e1ee9"/>
<textElement verticalAlignment="Middle">
<font fontName="Tahoma" size="10" isItalic="true"/>
</textElement>
<textFieldExpression><![CDATA["Time Run : "+new SimpleDateFormat("MM-dd-YYYY HH:mm:ss").format(new Date())]]></textFieldExpression>
</textField>
<textField>
<reportElement x="0" y="30" width="842" height="20" uuid="d6500562-18ff-4426-b997-c928ea4fac7f"/>
<textElement textAlignment="Center">
<font fontName="Tahoma" size="11"/>
</textElement>
<textFieldExpression><![CDATA["Report Description"]]></textFieldExpression>
</textField>
<textField>
<reportElement x="0" y="100" width="842" height="20" uuid="5ac7e312-67d6-4cb5-b140-db61aec3a23e"/>
<box>
<topPen lineWidth="0.5" lineColor="#999999"/>
</box>
<textFieldExpression><![CDATA[""]]></textFieldExpression>
</textField>
<textField>
<reportElement x="0" y="70" width="422" height="30" uuid="9c55c0f6-3bdd-4a6e-89ea-c68f35afde77"/>
<textElement textAlignment="Left" verticalAlignment="Middle"/>
<textFieldExpression><![CDATA["Date Between "+$P{FromDateTZ} +" and "+$P{ToDateTZ}]]></textFieldExpression>
</textField>
<textField>
<reportElement x="422" y="70" width="420" height="30" uuid="a3f557b3-cd79-42b6-b5b4-ab1d959edb3f"/>
</textField>
<textField>
<reportElement x="422" y="70" width="280" height="30" uuid="a6716a87-4ac6-469a-9340-808348561b83"/>
<textElement textAlignment="Center" verticalAlignment="Middle"/>
<textFieldExpression><![CDATA[$P{REPORT_TIME_ZONE}.toString()]]></textFieldExpression>
</textField>
<textField>
<reportElement x="0" y="0" width="0" height="0" uuid="8f70b2ad-ad64-4bef-8d7e-fd35dcf761dc">
<property name="com.jaspersoft.studio.unit.width" value="pixel"/>
<property name="com.jaspersoft.studio.unit.height" value="pixel"/>
</reportElement>
<textFieldExpression><![CDATA[$P{REPORT_TIME_ZONE}.getTimeZone($P{userTimezone})]]></textFieldExpression>
</textField>
</band>
</title>
<pageHeader>
<band splitType="Stretch"/>
</pageHeader>
<columnHeader>
<band height="30" splitType="Stretch">
<property name="com.jaspersoft.studio.unit.height" value="pixel"/>
<textField>
<reportElement style="column header" stretchType="RelativeToTallestObject" x="0" y="0" width="142" height="30" uuid="47351e64-0eed-4b3f-8e65-bbd4aa71707b"/>
<textFieldExpression><![CDATA["transcribed_date"]]></textFieldExpression>
</textField>
<textField>
<reportElement style="column header" stretchType="RelativeToTallestObject" x="142" y="0" width="140" height="30" uuid="5b44c994-90f9-4861-9dbd-37b0f2a4325f"/>
<textFieldExpression><![CDATA["created_date"]]></textFieldExpression>
</textField>
<textField>
<reportElement style="column header" stretchType="RelativeToTallestObject" x="282" y="0" width="140" height="30" uuid="118a7ea2-1a87-46ad-887b-9258ac5b39f5"/>
<textFieldExpression><![CDATA["delivered_date"]]></textFieldExpression>
</textField>
<textField>
<reportElement style="column header" stretchType="RelativeToTallestObject" x="422" y="0" width="140" height="30" uuid="16275c85-468f-4f0f-bc11-56741eca0c01"/>
<textFieldExpression><![CDATA["job_id"]]></textFieldExpression>
</textField>
<textField>
<reportElement style="column header" stretchType="RelativeToTallestObject" x="562" y="0" width="140" height="30" uuid="60ba0fee-da2a-40d1-9a15-c7dd6a699e6d"/>
<textFieldExpression><![CDATA["client_facility_id"]]></textFieldExpression>
</textField>
<textField>
<reportElement style="column header" stretchType="RelativeToTallestObject" x="702" y="0" width="140" height="30" uuid="7e7b7403-55d3-4414-b9a5-f55e9a4503c3"/>
<textFieldExpression><![CDATA["dictation_length"]]></textFieldExpression>
</textField>
</band>
</columnHeader>
<detail>
<band height="30" splitType="Stretch">
<property name="com.jaspersoft.studio.unit.height" value="pixel"/>
<textField>
<reportElement style="detail" stretchType="RelativeToTallestObject" x="0" y="0" width="142" height="30" uuid="ac7dc00e-7886-4ada-84f2-a626739b4390">
<property name="com.jaspersoft.studio.unit.y" value="pixel"/>
</reportElement>
<textFieldExpression><![CDATA[$F{transcribed_date}]]></textFieldExpression>
</textField>
<textField>
<reportElement style="detail" stretchType="RelativeToTallestObject" x="142" y="0" width="140" height="30" uuid="58f2d24f-451d-429b-a6ba-adf3b6095093"/>
<textFieldExpression><![CDATA[$F{created_date}]]></textFieldExpression>
</textField>
<textField>
<reportElement style="detail" stretchType="RelativeToTallestObject" x="282" y="0" width="140" height="30" uuid="256ad4fb-2886-4368-8097-635c2991064d"/>
<textFieldExpression><![CDATA[$F{delivered_date}]]></textFieldExpression>
</textField>
<textField>
<reportElement style="detail" stretchType="RelativeToTallestObject" x="422" y="0" width="140" height="30" uuid="2beac647-69e2-4fb6-bbe2-9a9730038a56"/>
<textFieldExpression><![CDATA[$F{job_id}]]></textFieldExpression>
</textField>
<textField>
<reportElement style="detail" stretchType="RelativeToTallestObject" x="562" y="0" width="140" height="30" uuid="a88d32dd-1cc3-4bdc-9ef9-540b022377c9"/>
<textFieldExpression><![CDATA[$F{client_facility_id}]]></textFieldExpression>
</textField>
<textField>
<reportElement style="detail" stretchType="RelativeToTallestObject" x="702" y="0" width="140" height="30" uuid="82fb777d-e46f-448f-a4c5-dab3b9ca0b3f"/>
<textFieldExpression><![CDATA[$F{dictation_length}]]></textFieldExpression>
</textField>
</band>
</detail>
<columnFooter>
<band splitType="Stretch"/>
</columnFooter>
<pageFooter>
<band splitType="Stretch"/>
</pageFooter>
<summary>
<band splitType="Stretch">
<property name="com.jaspersoft.studio.unit.height" value="pixel"/>
</band>
</summary>
<noData>
<band height="40">
<staticText>
<reportElement x="0" y="0" width="842" height="40" uuid="2de331a1-b95b-4154-99f7-095e5cade32c"/>
<textElement verticalAlignment="Middle">
<font fontName="Tahoma" size="11" isBold="false"/>
</textElement>
<text><![CDATA[No Results
The specified criteria didn't result in any data. This is often caused by applying filters and/or selections that are too restrictive or that contain incorrect values. Please check your Analysis Filters and try again. ]]></text>
</staticText>
</band>
</noData>
</jasperReport>
If you see this is build for accepting three parameters. Two date fields and one users timezone prompt. Based upon the date filter provided I'm converting the those to users time zone format and passing that to the database. The issue is while printing the result on there timezone. As my report has three date time fields which should display the result also as per there user timezone.
My question is there any way I can fix the timezone at the top of the report instead of converting all the three date time fields individually. Let me know if you need more clarification on this. Thanks
when the code running in an ipad,there are some lines(white or black) on the pictrue.And when I click the 'zoom' button , the lines will move.But it is normal when the code running in computors. How to figure out the problems?
New Document
<body>
<script type="text/javascript">
function zoom(){
var svg = document.getElementById("svg");
var viewBox = svg.getAttribute("viewBox").split(",")
svg.setAttribute("viewBox",[viewBox[0]-10,viewBox[1]-10,viewBox[2],viewBox[3]])
console.info(viewBox)
}
</script>
<svg id="svg" width="500" height="500" xmlns="http://www.w3.org/2000/svg" viewBox="-200,-200,500,500">
<defs>
<pattern id="raphael-pattern-0" x="0" y="0" patternUnits="userSpaceOnUse" width="116" height="116">
<rect x="0" y="0" width="118" height="118" fill="green"/>
</pattern>
</defs>
<path stroke-width="0" stroke-opacity="0" fill-opacity="1" fill="url(#raphael-pattern-0)" stroke="#000000" d="M204.610 -279.078 L204.610 170.922 L-245.390 170.922 L-245.390 -279.078 z"/>
</svg>
<input type="button" value="ZOOM" onclick="zoom()">
</body>
</html>