ChartDirector 6.0 (Ruby Edition)
Multi-Line Chart (2)
Source Code Listing
require("chartdirector") class Multiline2Controller < ApplicationController def index() @title = "Multi-Line Chart (2)" @ctrl_file = File.expand_path(__FILE__) @noOfCharts = 1 render :template => "templates/chartview" end # # Render and deliver the chart # def getchart() # In this example, we simply use random data for the 3 data series. r = ChartDirector::RanSeries.new(129) data0 = r.getSeries(100, 100, -15, 15) data1 = r.getSeries(100, 160, -15, 15) data2 = r.getSeries(100, 220, -15, 15) timeStamps = r.getDateSeries(100, Time.mktime(2014, 1, 1), 86400) # Create a XYChart object of size 600 x 400 pixels c = ChartDirector::XYChart.new(600, 400) # Add a title box using grey (0x555555) 20pt Arial font c.addTitle(" Multi-Line Chart Demonstration", "arial.ttf", 20, 0x555555) # Set the plotarea at (70, 70) and of size 500 x 300 pixels, with transparent background and # border and light grey (0xcccccc) horizontal grid lines c.setPlotArea(70, 70, 500, 300, ChartDirector::Transparent, -1, ChartDirector::Transparent, 0xcccccc) # Add a legend box with horizontal layout above the plot area at (70, 35). Use 12pt Arial # font, transparent background and border, and line style legend icon. b = c.addLegend(70, 35, false, "arial.ttf", 12) b.setBackground(ChartDirector::Transparent, ChartDirector::Transparent) b.setLineStyleKey() # Set axis label font to 12pt Arial c.xAxis().setLabelStyle("arial.ttf", 12) c.yAxis().setLabelStyle("arial.ttf", 12) # Set the x and y axis stems to transparent, and the x-axis tick color to grey (0xaaaaaa) c.xAxis().setColors(ChartDirector::Transparent, ChartDirector::TextColor, ChartDirector::TextColor, 0xaaaaaa) c.yAxis().setColors(ChartDirector::Transparent) # Set the major/minor tick lengths for the x-axis to 10 and 0. c.xAxis().setTickLength(10, 0) # For the automatic axis labels, set the minimum spacing to 80/40 pixels for the x/y axis. c.xAxis().setTickDensity(80) c.yAxis().setTickDensity(40) # Add a title to the y axis using dark grey (0x555555) 14pt Arial font c.yAxis().setTitle("Y-Axis Title Placeholder", "arial.ttf", 14, 0x555555) # Add a line layer to the chart with 3-pixel line width layer = c.addLineLayer2() layer.setLineWidth(3) # Add 3 data series to the line layer layer.addDataSet(data0, 0x5588cc, "Alpha") layer.addDataSet(data1, 0xee9944, "Beta") layer.addDataSet(data2, 0x99bb55, "Gamma") # The x-coordinates for the line layer layer.setXData(timeStamps) # Output the chart send_data(c.makeChart2(ChartDirector::PNG), :type => "image/png", :disposition => "inline") end end |
<html> <body style="margin:5px 0px 0px 5px"> <!-- Title --> <div style="font-size:18pt; font-family:verdana; font-weight:bold"> <%= @title %> </div> <hr style="border:solid 1px #000080" /> <!-- Source Code Listing Link --> <div style="font-size:9pt; font-family:verdana; margin-bottom:1.5em"> <%= link_to "Source Code Listing", :controller => "cddemo", :action => "viewsource", :ctrl_file => @ctrl_file, :view_file => File.expand_path(__FILE__) %> </div> <!-- Create one or more IMG tags to display the demo chart(s) --> <% 0.upto(@noOfCharts - 1) do |i| %> <img src="<%= url_for(:action => "getchart", :img => i) %>"> <% end %> </body> </html> |
#!/usr/bin/env ruby require("chartdirector") # In this example, we simply use random data for the 3 data series. r = ChartDirector::RanSeries.new(129) data0 = r.getSeries(100, 100, -15, 15) data1 = r.getSeries(100, 160, -15, 15) data2 = r.getSeries(100, 220, -15, 15) timeStamps = r.getDateSeries(100, Time.mktime(2014, 1, 1), 86400) # Create a XYChart object of size 600 x 400 pixels c = ChartDirector::XYChart.new(600, 400) # Add a title box using grey (0x555555) 20pt Arial font c.addTitle(" Multi-Line Chart Demonstration", "arial.ttf", 20, 0x555555) # Set the plotarea at (70, 70) and of size 500 x 300 pixels, with transparent background and border # and light grey (0xcccccc) horizontal grid lines c.setPlotArea(70, 70, 500, 300, ChartDirector::Transparent, -1, ChartDirector::Transparent, 0xcccccc ) # Add a legend box with horizontal layout above the plot area at (70, 35). Use 12pt Arial font, # transparent background and border, and line style legend icon. b = c.addLegend(70, 35, false, "arial.ttf", 12) b.setBackground(ChartDirector::Transparent, ChartDirector::Transparent) b.setLineStyleKey() # Set axis label font to 12pt Arial c.xAxis().setLabelStyle("arial.ttf", 12) c.yAxis().setLabelStyle("arial.ttf", 12) # Set the x and y axis stems to transparent, and the x-axis tick color to grey (0xaaaaaa) c.xAxis().setColors(ChartDirector::Transparent, ChartDirector::TextColor, ChartDirector::TextColor, 0xaaaaaa) c.yAxis().setColors(ChartDirector::Transparent) # Set the major/minor tick lengths for the x-axis to 10 and 0. c.xAxis().setTickLength(10, 0) # For the automatic axis labels, set the minimum spacing to 80/40 pixels for the x/y axis. c.xAxis().setTickDensity(80) c.yAxis().setTickDensity(40) # Add a title to the y axis using dark grey (0x555555) 14pt Arial font c.yAxis().setTitle("Y-Axis Title Placeholder", "arial.ttf", 14, 0x555555) # Add a line layer to the chart with 3-pixel line width layer = c.addLineLayer2() layer.setLineWidth(3) # Add 3 data series to the line layer layer.addDataSet(data0, 0x5588cc, "Alpha") layer.addDataSet(data1, 0xee9944, "Beta") layer.addDataSet(data2, 0x99bb55, "Gamma") # The x-coordinates for the line layer layer.setXData(timeStamps) # Output the chart c.makeChart("multiline2.png") |