Pre loader

Tag: #Rendering

Welcome to the SciChart Forums!

  • Please read our Question Asking Guidelines for how to format a good question
  • Some reputation is required to post answers. Get up-voted to avoid the spam filter!
  • We welcome community answers and upvotes. Every Q&A improves SciChart for everyone

WPF Forums | JavaScript Forums | Android Forums | iOS Forums

0 votes
11k views

I’m implementing exporting charts. As part of my export, the user can specify the size of the chart. I’ve managed to get sciChartSurface.ExportToBitmapSource() working fine for single graphs.

However, I’ve got some quite complex layouts, and when I try to render parent controls that contain Scichart controls manually, with say:

ExportUIElement.Measure(size);
ExportUIElement.Arrange(new Rect(size));

 int dpiScaling = 3;
RenderTargetBitmap bmp = new RenderTargetBitmap(Width * dpiScaling, Height * dpiScaling,
                                                                                                           96 * dpiScaling, 96 * dpiScaling,
                                                                                                           PixelFormats.Pbgra32);

I’m finding everything working, the chart layout & axis/labels update and render fine, but the chart content is not re-rendered to the new size, causing some messy/strange visual effects. This one was arranged to a larger size, you can see that the actual chart content is now sitting snugly in the middle of a large margin:

enter image description here

Can I force Scichart to re-render these so I can manually render the component in a different size?

  • Ken Hobbs asked 7 years ago
  • last active 5 years ago
0 votes
9k views

Running off of visual studio 2017. Slightly changed one of the line examples. Here is my source code.

// *************************************************************************************
// SCICHART® Copyright SciChart Ltd. 2011-2017. All rights reserved.
//
// Web: http://www.scichart.com
// Support: [email protected]
// Sales: [email protected]
//
// LineChartExampleView.xaml.cs is part of the SCICHART® Examples. Permission is hereby granted
// to modify, create derivative works, distribute and publish any part of this source
// code whether for commercial, private or personal use.
//
// The SCICHART® examples are distributed in the hope that they will be useful, but
// without any warranty. It is provided “AS IS” without warranty of any kind, either
// expressed or implied.
// *************************************************************************************
using System;
using System.Collections.Generic;
using System.Collections.ObjectModel;
using System.ComponentModel;
using System.Globalization;
using System.Linq;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Media;
using SciChart.Charting.Model.DataSeries;
using SciChart.Charting.Visuals.RenderableSeries;
using SciChart.Data.Model;
using SciChart.Examples.ExternalDependencies.Data;
using SciChart.Charting;

namespace SciChart.Examples.Examples.CreateSimpleChart
{
public partial class LineChartExampleView : UserControl
{
public LineChartExampleView()
{
InitializeComponent();

    }

    private void LineChartExampleView_OnLoaded(object sender, RoutedEventArgs e)
    {            
        // Create a DataSeries of type X=double, Y=double
        var dataSeries = new XyDataSeries<double, double>();

        lineRenderSeries.DataSeries = dataSeries;

        var data = DataManager.Instance.GetFourierSeries(1.0, 0.1);

        // Append data to series. SciChart automatically redraws
        ThemeManager.SetTheme(this, "Chrome");
        dataSeries.Append(data.XData, data.YData);

        sciChart.ZoomExtents();
    }

    private void Button_Click(object sender, RoutedEventArgs e)
    {
        Clipboard.SetImage(this.sciChart.ExportToBitmapSource());
    }
}

}

And the xaml

<UserControl.Resources>
    <ResourceDictionary>
    </ResourceDictionary>
</UserControl.Resources>

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="Auto" />
        <ColumnDefinition Width="*" />
    </Grid.ColumnDefinitions>

    <!--  The SciChartInteractionToolbar adds zoom, pan, zoom extents and rotate functionality  -->
    <!--  to the chart and is included for example purposes.  -->
    <!--  If you wish to know how to zoom and pan a chart then do a search for Zoom Pan in the Examples suite!  -->
    <Button Foreground="AntiqueWhite"  Visibility="Visible" Click="Button_Click" MinWidth="100" MinHeight="40">COPY</Button>



    <!--  Create the chart surface  -->
    <s:SciChartSurface Name="sciChart"
                       Grid.Column="1">

        <!--  Declare RenderableSeries  -->
        <s:SciChartSurface.RenderableSeries>
            <s:FastLineRenderableSeries x:Name="lineRenderSeries"
                                        Stroke="#FF99EE99"
                                        StrokeThickness="2"/>
        </s:SciChartSurface.RenderableSeries>

        <!--  Create an X Axis with Growby  -->
        <s:SciChartSurface.XAxis>
            <s:NumericAxis DrawMajorBands="True"
                           FlipCoordinates="True"
                           GrowBy="0.1, 0.1"
                           ScientificNotation="None"
                           TextFormatting="#.############" />
        </s:SciChartSurface.XAxis>

        <!--  Create a Y Axis with Growby. Optional bands give a cool look and feel for minimal performance impact  -->
        <s:SciChartSurface.YAxis>
            <s:NumericAxis DrawMajorBands="True" GrowBy="0.5, 0.5" />
        </s:SciChartSurface.YAxis>

    </s:SciChartSurface>
</Grid>

All I did was remove the toolbar and a dd a button that copied the image to the clipboard. Yet Somehow the result of what you see while running and what you get from the clipboard are not the same. The lower half of the image you get by rendering to memory is clearly darker. I tried uploading them but could not.

0 votes
8k views

Hello SciChart,

I’m using SciChart:PerformanceHelper.EnableExtremeResamplers=”True” on my SciChart surface to display data with multiple gaps properly (NaN values), however the XPS output using ExportToFile does not work well and only renders the data to the first gap. Is there a workaround to this issue or how can it be fixed? Thank you.

Kind regards
Ondřej

0 votes
8k views

I was testing my charts on a simulator and when I naved away and then back to the chart screen the Simulator’s chart was totally black screen; I could move the mouse over the points and the popouts would occur; and your license notice showed in the center of the chart. So it was almost like it thought all the drawing for the chart itself needed to be black on black.

It was always broken on the 2nd or later chart. Restarting the app fixed it. I tried removing all custom settings, and calling the invalidate; and nothing caused it to redraw correctly… Fortunately, when deploying to real devices everything worked correctly. Is this an expected side effect of testing on a simulator, or is their something that I can do to force a hard refresh of the chart…

FYI: The additional debug diagnostics don’t seem to do anything on a simulator, or at least I couldn’t find anywhere it was logged.

1 vote
8k views

This might be a feature request, I don’t know. Basically, I’m trying to plot a 3D scatter-plot and programmatically insert an arbitrary number of partially transparent free surface meshes in the same area as the scatter-plot. I started small and made some spheres. Some of my points are inside the spheres. These points are important, and I have my own functions that detect collisions between points and the spheres. The scatter-plot is also dynamic, where I update the color and transparency of the points and this means something. When all of the points are completely opaque, I get the desired behavior where I can see the points inside and behind the partially transparent meshes. However, when I make even one point transparent, all of the points inside and behind the mesh stop rendering. This is really annoying. Deletion is too slow. Is there anyway to force these fully opaque points to continue to render inside the partially transparent mesh while their brothers in the scatter-plot data series are transparent?

Second question, while I’m here. I’ve bolted a UI to the side of the Sci-Chart environment. What is the best way to make sure that the UI stays responsive even if the Sci-Chart environment starts to slow down? I want to crank up the point count past any reason.

https://www.youtube.com/watch?v=0IBBG6WEQw8 I’ve also uploaded a video of my problem. Before I check the box “Draw Geo-fence Violations Only”, all points in the data series 100% not transparent. When I check the box, all the white points start to become 100% transparent. When I click “Draw Geo-fences”, the meshes become 100% transparent (it’s backwards I know). The points are obviously still within the bounds of the mesh, as when the I turn off the mesh they start rendering. You can also see some red dots outside the mesh, as my program flagged a few points right next to the mesh as being inside it. These red dots outside the mesh render even when the red dots inside the mesh don’t.

1 vote
2k views

I’m overriding FastLineRenderableSeries so I can do some custom rendering.

I have a data series defined as :

 var xyDataSeries = new XyDataSeries<double>();
            xyDataSeries.Append(0, 0);
            xyDataSeries.Append(1, 1);
Test.DataSeries = xyDataSeries;

and my chart as :

<s:SciChartSurface Loaded="SciChartSurface_Loaded">
        <s:SciChartSurface.RenderableSeries>
            <customSeriesMvvmExample:FastLineRenderableSeriesEx x:Name="Test" />
        </s:SciChartSurface.RenderableSeries>
        <s:SciChartSurface.XAxis>
            <s:NumericAxis/>
        </s:SciChartSurface.XAxis>
        <s:SciChartSurface.YAxis>
            <s:NumericAxis/>
        </s:SciChartSurface.YAxis>
    </s:SciChartSurface>

And then I override InternalDraw :

public class FastLineRenderableSeriesEx : FastLineRenderableSeries
{
    protected override void InternalDraw(IRenderContext2D renderContext, IRenderPassData renderPassData)
    {
        base.InternalDraw(renderContext, renderPassData);

        using (var brush = renderContext.CreateBrush(Colors.Transparent))
        using (var pen = renderContext.CreatePen(Stroke, true, StrokeThickness, Opacity))
        {

            var xCalc = renderPassData.XCoordinateCalculator;
            var yCalc = renderPassData.YCoordinateCalculator;

            var xCoord = xCalc.GetCoordinate(0.5);
            var yCoord = yCalc.GetCoordinate(0.5);

            renderContext.DrawEllipse(pen, brush, new System.Windows.Point(xCoord, yCoord), 150, 150);

            renderContext.DrawLine(pen, 
                new System.Windows.Point(xCalc.GetCoordinate(0.6), yCalc.GetCoordinate(0)),
                new System.Windows.Point(xCalc.GetCoordinate(2), yCalc.GetCoordinate(1.4)));
        }
    }
}

The problem is that the base.InternalDraw draws the original data series line very nicely with anti-aliasing, but the custom circle I draw has no AA, and the custom line I draw looks very thin?

what’s going on here?

  • forl forl asked 11 months ago
  • last active 11 months ago
1 vote
2k views

By following this example to create reusable SciChart component in React:

https://www.scichart.com/documentation/js/current/TutorialReusableReactComponent.html

The chart cannot be created when run in dev mode. But it works well under production mode. I think it’s because React renders components twice in strict mode. It seems that SciChart got problems to create chart with the following logic when running the application in dev mode. Is this true? Or I missed anything?

 useEffect(() => {
    const chartInitializationPromise = props.initChart(rootElementId).then((initResult) => {
        sciChartSurfaceRef.current = initResult.sciChartSurface;
        return initResult.sciChartSurface;
    });
    const performCleanup = () => {
        sciChartSurfaceRef.current.delete();
        sciChartSurfaceRef.current = undefined;
    };

    return () => {
        // check if chart is already initialized or wait init to finish before deleting it
        sciChartSurfaceRef.current ? performCleanup() : chartInitializationPromise.then(performCleanup);
    };
}, []);
  • Quyen Sy asked 9 months ago
  • last active 3 months ago
1 vote
5k views

Hi SciChart,

We are experiencing a SciChart XPS export issue.

I am using a FlowDocumentPageViewer with a FlowDocument containing SciChart graphs. My goal is to export all pages of the FlowDocument to an XPS file using the XamlRenderSurface to save in vector graphics. However, I’m facing an issue where only the currently selected page exports correctly, while the other pages display empty graphs.

By default, we employ the VisualXcceleratorRenderSurface for all SciChart render surfaces. Before exporting, I programmatically switch them to XamlRenderSurface to save in vector graphics. This approach works well when all the graphs have been rendered on-screen at least once with the new surface type before exporting. However, if a graph hasn’t been rendered on-screen before exporting, it appears empty, and only the graphs from the selected page export correctly. You can find code snippets below.

XAML code:

<s:SciChartSurface
    x:Name="PART_Surface"
    ...
    RenderSurface="{TemplateBinding RenderType, Converter={StaticResource RenderTypeConverter}}"
    ...

Converter:

public class RenderTypeConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
    {
        // Set render settings
        return (RenderType)value switch
        {
            RenderType.DirectX => new VisualXcceleratorRenderSurface(),
            RenderType.HighQuality => new HighQualityRenderSurface(),
            RenderType.HighSpeed => new HighSpeedRenderSurface(),
            RenderType.Vector => new XamlRenderSurface(),
            _ => new HighSpeedRenderSurface(),
        };
    }
    ...
}

Export:

private void ExportVector(string fullPath)
{
    // Sets the RenderType to Vector for all surfaces
    // This invokes RenderTypeConverter to set the RenderSurface to XamlRenderSurface
    // Since they are bound in the XAML code
    SetAxesSurfacesRenderToVector();

    XPS_Export_AllPagesOfFlowDocument(fullPath);

    // DirectX is always the default for all surfaces that we use
    ResetAxesSurfacesToDirectX();
}
private void XPS_Export_AllPagesOfFlowDocument(string fullPath)
{
    using (var package = Package.Open(fullPath, FileMode.Create))
    {
        using (var xpsDocument = new XpsDocument(package, CompressionOption.Maximum))
        {
            var xpsSerializationManager = new XpsSerializationManager(new XpsPackagingPolicy(xpsDocument), false);
            var documentPaginator = ((IDocumentPaginatorSource)FlowDocument)?.DocumentPaginator;
            xpsSerializationManager.SaveAsXaml(documentPaginator);

            xpsDocument.Close();
        }
    }
}

The binding and the converter works for all offscreen elements, yet the they won’t take effect until rendered on screen at least once.
I have to select each page manually, after setting all graphs to use XamlRenderSurface, so each would be rendered on screen at least once before the export.

My question is: How can I export XamlRenderSurfaces that are off-screen and haven’t been rendered on-screen before the export process?

You can find an image below showcasing the problem.

Thank you and looking forward to your reply!

Best Regards,
Kaloyan Krastev

0 votes
12k views

In the oil industry a well survey is usually displayed by a series of points connected by arcs. An arc is very close to the actual path a drill will take between points on a survey. Survey points are about 90 feet apart, so connecting them with a straight line looks ugly. Which method should I override to accomplish this?

If I get ambitious, I may also consider using Bezier curves to connect points, as this could be useful to represent geological boundaries as a background for my well survey plots.

I have attached a picture showing the type of plots I need to make. The red line is a survey and the background represents geological layers. The survey is presently connected with straight lines, which makes it difficult to determine precisely where the survey intercept the boundaries.

0 votes
9k views

Performance degrades at a much higher rate when adding FastBandSeries (with multiple axes) when compared to FastLineSeries (with one Y-Axis)

I have this demo project that shows the rendering stuttering that occurs when panning the FastBand Chart. To ensure that this is not some performance hit of purely having multiple Y-Axes, you can simply add one series and the behavior persists. (As well as I know there are examples with multiple Y-Axes with line series that are blazing fast).

I would really like to get to the bottom of this as the one chart type is dragging down the performance of our product overall.

Below the demo project is attached.

It has been 3 weeks since I’ve posted with no input or feedback — quite unacceptable.

Showing 10 results