|
Hash pattern Zone fill |
Posted by Mark on Apr-07-2008 06:02 |
|
I am having trouble using a pattern fill for a zone. If I create a fill pattern using:
int pat = c.patternColor2("myfile.png"); // or even use c.patternColor(args)
then use:
c.addZone(30,100,pat);
I get a weird vertical stripe pattern. This always looks the same no matter what file I
read or even if I use patternColor() to create my own pattern. I *have* been able to use
a pattern successfully to create my wallpaper background earlier in the code, but
addZone() just doesn't seem to be compatible with a pattern in place of a color.
Am I doing something wrong? The document example shows use of patternColor() and
patternColor2() for the title bar and for a data fill, but no example is given showing use of
a patternColor() for a zone. Does zone need to be treated differently?
Mark |
Re: Hash pattern Zone fill |
Posted by Peter Kwan on Apr-08-2008 02:53 |
|
Hi Mark,
From your previous enquiries, I assume you are using Java.
I have tried myself. In my case, the code works normally.
I have attached my test code and the resulting image for your reference. It is based on the "pattern area chart" sample code that comes with ChartDirector, but I use the pattern to fill a zone instead of the area under the line.
If in your case, your cannot use a pattern for a zone, is it possible to include an example (may be just modify my test code to illustrate the problem), so I may try it myself?
Regards
Peter Kwan
|
patternarea.java |
---|
import java.awt.event.*;
import javax.swing.*;
import ChartDirector.*;
public class patternarea
{
//Main code for creating charts
public void createChart(ChartViewer viewer, int index)
{
// The data for the area chart
double[] data = {3.0, 2.8, 4.0, 5.5, 7.5, 6.8, 5.4, 6.0, 5.0, 6.2, 7.5, 6.5,
7.5, 8.1, 6.0, 5.5, 5.3, 3.5, 5.0, 6.6, 5.6, 4.8, 5.2, 6.5, 6.2};
// The labels for the area chart
String[] labels = {"0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "10",
"11", "12", "13", "14", "15", "16", "17", "18", "19", "20", "21", "22",
"23", "24"};
// Create a XYChart object of size 300 x 180 pixels. Set the background to
// pale yellow (0xffffa0) with a black border (0x0)
XYChart c = new XYChart(300, 180, 0xffffa0, 0x000000);
// Set the plotarea at (45, 35) and of size 240 x 120 pixels. Set the
// background to white (0xffffff). Set both horizontal and vertical grid
// lines to black (&H0&) dotted lines (pattern code 0x0103)
c.setPlotArea(45, 35, 240, 120, 0xffffff, -1, -1, c.dashLineColor(0x000000,
0x000103), c.dashLineColor(0x000000, 0x000103));
// Add a title to the chart using 10 pts Arial Bold font. Use a 1 x 2 bitmap
// pattern as the background. Set the border to black (0x0).
c.addTitle("Snow Percipitation (Dec 12)", "Arial Bold", 10).setBackground(
c.patternColor(new int[]{0xb0b0f0, 0xe0e0ff}, 2), 0x000000);
// Add a title to the y axis
c.yAxis().setTitle("mm per hour");
// Set the labels on the x axis.
c.xAxis().setLabels(labels);
// Display 1 out of 3 labels on the x-axis.
c.xAxis().setLabelStep(3);
// Add an area layer to the chart
LineLayer layer = c.addLineLayer(data);
layer.setLineWidth(2);
// Load a snow pattern from an external file "snow.png".
int snowPattern = c.patternColor2("snow.png");
c.yAxis().addZone(5, 9, snowPattern);
// output the chart
viewer.setImage(c.makeImage());
//include tool tip for the chart
viewer.setImageMap(c.getHTMLImageMap("clickable", "",
"title='{xLabel}:00 - {value} mm/hour'"));
}
//Allow this module to run as standalone program for easy testing
public static void main(String[] args)
{
//Instantiate an instance of this demo module
patternarea demo = new patternarea();
//Create and set up the main window
JFrame frame = new JFrame(demo.toString());
frame.addWindowListener(new WindowAdapter() {
public void windowClosing(WindowEvent e) {System.exit(0);} });
// Create the chart and put them in the content pane
ChartViewer viewer = new ChartViewer();
demo.createChart(viewer, 0);
frame.getContentPane().add(viewer);
// Display the window
frame.pack();
frame.setVisible(true);
}
}
|
|
| |
Re: Hash pattern Zone fill |
Posted by Mark on Apr-11-2008 10:49 |
|
Peter,
Thanks for the time and effort you spent trying to answer my question. My code has almost exactly what you sample showed, except: 1) the filename is different; 2) I instead use xy.yAxis().addZone(...) where you use c.yAxis().addZone(...)...
Regarding 1)... I know the filename is not the problem because I use this same file in an earlier call to c.patternColor2(...) for setting the background wallpaper and that works just fine. So, this means that the problem has to exist in 2)...
Regarding 2)... I am using a multi-chart and must use "xy" not "c" in this case to reference the proper plot area. Now, I tried using xy.patternColor2(...) instead of c.patternColor2(...) and that made the difference. So my problem is partially fixed.
I say "partially" because I really don't want to use a file, but instead use the other form you show in your example, namely:
c.patternColor(new int[]{0xb0b0f0,0xe0e0ff},2)...
And can't get it looking right. I'm trying to wrap my brain around what the hex numbers mean. I haven't found where the documentation explains this all that clearly. I suppose the numbers represent a bitmap in some way, but beyond that, I am lost. Can you point me to more explicit information about this? My goal is to have thick diagonal stripes as a fill pattern.
And yes, I'm using Java...
Mark |
Re: Hash pattern Zone fill |
Posted by Peter Kwan on Apr-12-2008 01:07 |
|
Hi Mark,
In ChartDirector, the pattern color needs to be defined with the BaseChart object that uses the color. For example, if the color is to be used in the "xy" chart, then the pattern color needs to be defined using the "xy" chart.
In your case, if you use pattern color, please ensure it is defined using the "xy" chart:
int ccc = xy.patternColor(new int[]{0xb0b0f0,0xe0e0ff},2);
The above is a bitmap pattern consists of 1 x 2 pixels (width x height). When tiled in a zone like a wallpaper, it should look like two alternating horizontal lines with different colors.
The hex number b0b0f0 and e0e0ff are the colors of the two pixels. This is the same as the color syntax use in HTML web pages. (Are you writing a web application or a windows application?) However, in HTML, you need to prepend the color by "#" (like #b0b0ff), while in Java, you need to use "0x" (like "0xb0b0f0"). The "#" or "0x" are not part of the color, but is just the syntax requirement of the language.
Hope this can help.
Regards
Peter Kwan |
Re: Hash pattern Zone fill |
Posted by Mark on Apr-12-2008 08:44 |
|
int ccc = xy.patternColor(new int[]{0xb0b0f0,0xe0e0ff},2);
So the two colors above appear like they would render 2 shades of light blue. Can I use transparency in these colors, too? For example 0x80b0b0f0, 0x80e0e0ff for 50% transparency?
Whether I have a 2-value integer array as shown here or a 40-value integer array, it seems that using this function, patternColor(), would still only give me a horizontal pattern that repeats in the vertical. How can I create a vertical pattern that repeats horizontally, or even better yet, a diagonal pattern??
Mark |
Re: Hash pattern Zone fill |
Posted by Peter Kwan on Apr-12-2008 14:10 |
|
Hi Mark,
Yes. You can always use transparent colors for the pixels.
You can use any pattern you want. First, you need to know the "tile" of your pattern. For example, to create a diagonal line, you may use a tile that is 3 x 3 pixels, with 3 diagnoal pixels colored as blue, and the other pixels as transparent. The nine pixels are arranged in an array like:
0, 1, 2
3, 4, 5,
6, 7, 8
So it means you want the 0, 4, 8 pixels to be blue, and other pixels to be transparent. So your array is:
int ccc = xy.patternColor(new int[]{
0x0000ff, Chart.Transparent, Chart.Transparent,
Chart.Transparent, 0x0000ff, Chart.Transparent,
Chart.Transparent, Chart.Transparent, 0x0000ff
}, 3);
For any other pattern, just imagine what is the tile, then create the array representing the title. The last parameter (3 above) is the height of the bitmap. There is no need to specify the width of the bitmap. For example, in the above, the array has nine elements, and the height is 3. ChartDirector can automatically know that the width must be 3. So the above array represents a bitmap that is 3 x 3 (instead of 1 x 9 or 9 x 1).
Hope this can help.
Regards
Peter Kwan |
Re: Hash pattern Zone fill |
Posted by Mark on Apr-12-2008 16:28 |
|
Awesome! Very Helpful! Thanks for all your tireless support!
Mark |
|