Nevron Forum

Zoom data with image background

https://www.nevron.com/Forum/Topic5056.aspx

By Michael Hayford - Wednesday, April 6, 2011

I have an application where I have an image that I put on the back wall of my chart. The image is registered to the data range of the axes, i.e. the image spans data ranges of 0:1 for the x axis and 0:1 for the y axis. I would like to synchronize the data zoom capabilities of the chart with the part of the image displayed. For example, if the user zooms in to a data range of 0.4:0.6 for x and 0.3:0.7 for y, I just want to show the part of the image that falls in that range. Right now, the data and axes zoom as desired, but I see the full size of the image on the back wall.
I suspect there may be a combination of MapMode and MapLayout (plus maybe Horizontal or VerticalScale) that would allow me to do this. Is this possible?
Thanks for your help.
Mike Hayford
By Nevron Support - Thursday, April 7, 2011

Currently it is not possible to achieve this with a texture mapped on the back wall. A relatively easy solution is to use a range series with a single data point that occupies the whole initial range in X and Y. A texture that is mapped on such a shape will be zoomed according to the scale ranges.
By Michael Hayford - Friday, April 8, 2011

Insidiously clever! This works as long as I add the rangeSeries last to the chart. Is there a way like "push to back" to ensure I get the desired behavior without relying on order of addition?
Thanks for your help.
Mike
By Nevron Support - Friday, April 8, 2011

Hi Mike,

The Z order of the series depends only on their positions in the Series collection. To ensure that a series is displayed "at back" you have to add it at the end of the collection, there is no other way.
By Diane Matsumoto - Wednesday, August 17, 2011

I realize this is an old topic, but would it be possible for someone to provide example code for this? I need to do the same thing but am new to Nevron.

By Nevron Support - Monday, August 22, 2011

The following code demonstrates how to use a Range data series to display an image inside the chart:

using System;
using System.Windows.Forms;
using Nevron.GraphicsCore;
using Nevron.Chart;
using Nevron.Chart.WinForm;

namespace TextureMappedRange
{
 public partial class Form1 : Form
 {
  public Form1()
  {
   InitializeComponent();
  }

  private void Form1_Load(object sender, EventArgs e)
  {
   // add interactivity tools
   nChartControl1.Controller.Tools.Add(new NSelectorTool());
   nChartControl1.Controller.Tools.Add(new NAxisScrollTool());
   nChartControl1.Controller.Tools.Add(new NDataZoomTool());

   // setup chart axes
   NCartesianChart chart = (NCartesianChart)nChartControl1.Charts[0];
   chart.Axis(StandardAxis.PrimaryX).ScaleConfigurator = new NLinearScaleConfigurator();
   chart.Axis(StandardAxis.PrimaryX).ScrollBar.Visible = true;
   chart.Axis(StandardAxis.PrimaryY).ScrollBar.Visible = true;

   // add a Range series with a single data point to display the image
   NRangeSeries range = new NRangeSeries();
   range.DataLabelStyle.Visible = false;
   range.FillStyle = new NImageFillStyle("D:\\Temp\\img\\EUROPE_map.jpg");
   range.UseXValues = true;
   range.Values.Add(10);
   range.Y2Values.Add(20);
   range.XValues.Add(1);
   range.X2Values.Add(2);
   chart.Series.Add(range);

   // add a range selection for the data zoom tool
   NRangeSelection rangeSelection = new NRangeSelection();
   chart.RangeSelections.Add(rangeSelection);
  }
 }
}

By Diane Matsumoto - Wednesday, August 31, 2011

That worked perfectly! Thank you!