function flot_example_page in Flot 7

1 string reference to 'flot_example_page'

flot_example_menu in flot_example/flot_example.module

Implements hook_menu

File

flot_example/flot_example.module, line 26

Code

function flot_example_page() {

  /**
   * Lines
   */
  $content = '<h3>' . t('Lines') . '</h3>';

  // Default display for flot data are lines.
  $d1 = new flotData(array(
    array(
      0,
      1,
    ),
    array(
      4,
      8,
    ),
    array(
      8,
      5,
    ),
  ));
  $d1->label = t('Example data 1');

  // We can explicitly set the lines property of the flot data for more advanced control.
  $d2 = new flotData(array(
    array(
      0,
      8,
    ),
    array(
      3,
      5,
    ),
    array(
      8,
      0.5,
    ),
  ));
  $d2->label = t('Example data 2');
  $d1->lines = new flotLine(array(
    'lineWidth' => 5,
  ));

  // We can add points to these lines by setting the points property.
  $d1->points = new flotPoint(array(
    'radius' => 5,
  ));

  // Set the variables array and pass it to theme('flot_graph').
  $variables = array(
    'data' => array(
      $d1,
      $d2,
    ),
    'element' => array(
      'id' => 'flot-example-normal',
      'class' => 'flot-example',
      'style' => "width:600px;height:400px",
    ),
    'legend' => TRUE,
    'zoom' => TRUE,
  );
  $content .= theme('flot_graph', $variables);

  /**
   * Points
   */
  $content .= '<h3>' . t('Points') . '</h3>';

  // If you want to display the data as points, simply set the points property.
  $d1 = new flotData(array(
    array(
      0,
      1,
    ),
    array(
      4,
      8,
    ),
    array(
      8,
      5,
    ),
  ));
  $d1->label = t('Example data 1');
  $d1->points = new flotPoint(array(
    'fillColor' => '#EDC240',
  ));

  // You don't have to specify settings when creating a flotPoint object, default settings will be used.
  $d2 = new flotData(array(
    array(
      0,
      8,
    ),
    array(
      3,
      5,
    ),
    array(
      8,
      0.5,
    ),
  ));
  $d2->label = t('Example data 2');
  $d2->points = new flotPoint();
  $variables = array(
    'data' => array(
      $d1,
      $d2,
    ),
    'element' => array(
      'id' => 'flot-example-normal',
      'class' => 'flot-example',
      'style' => "width:600px;height:400px",
    ),
    // Show a legend
    'legend' => TRUE,
    // Make the graph zoomable (click and drag over the graph to zoom in on a part of that graph)
    'zoom' => TRUE,
  );
  $content .= theme('flot_graph', $variables);

  /**
   * Bars
   */
  $content .= '<h3>' . t('Bars') . '</h3>';

  // If you want to display the data as bars, simply set the bar property.
  $d1 = new flotData(array(
    array(
      0,
      1,
    ),
    array(
      4,
      8,
    ),
    array(
      8,
      5,
    ),
  ));
  $d1->label = t('Example data 1');
  $d1->bars = new flotBar(array(
    'lineWidth' => 1,
    'barWidth' => 1,
  ));

  // You don't have to specify settings when creating a flotBar object, default settings will be used.
  $d2 = new flotData(array(
    array(
      0,
      8,
    ),
    array(
      3,
      5,
    ),
    array(
      8,
      0.5,
    ),
  ));
  $d2->label = t('Example data 2');
  $d2->bars = new flotBar();
  $variables = array(
    'data' => array(
      $d1,
      $d2,
    ),
    'element' => array(
      'id' => 'flot-example-normal',
      'class' => 'flot-example',
      'style' => "width:600px;height:400px",
    ),
    // Show a legend
    'legend' => TRUE,
    // Make the graph zoomable (click and drag over the graph to zoom in on a part of that graph)
    'zoom' => TRUE,
  );
  $content .= theme('flot_graph', $variables);

  /**
   * Pie
   */
  $content .= '<h3>' . t('Pie') . '</h3>';

  // If you want to display the data as a pie, pass it to the options in the variables array
  $d1 = new flotData(30);
  $d1->label = t('Example data 1 (30%)');
  $d1->pie = new flotPie();
  $d2 = new flotData(70);
  $d2->label = t('Example data 2 (70%)');
  $d2->pie = new flotPie();
  $variables = array(
    'data' => array(
      $d1,
      $d2,
    ),
    'element' => array(
      'id' => 'flot-example-normal',
      'class' => 'flot-example',
      'style' => "width:600px;height:400px",
    ),
    // Show a legend
    'legend' => FALSE,
    // Display the data as a pie.
    'options' => array(
      'pie' => TRUE,
    ),
  );
  $content .= theme('flot_graph', $variables);

  /**
   * Combination
   */
  $content .= '<h3>' . t('Combination') . '</h3>';

  // You can combine different display methods by simply setting the properties.
  $d1 = new flotData(array(
    array(
      0,
      1,
    ),
    array(
      4,
      8,
    ),
    array(
      8,
      5,
    ),
  ));
  $d1->label = t('Example data 1');
  $d1->lines = new flotLine();
  $d1->points = new flotPoint();
  $d1->bars = new flotBar();

  // You don't have to specify settings when creating a flotBar object, default settings will be used.
  $d2 = new flotData(array(
    array(
      0,
      8,
    ),
    array(
      3,
      5,
    ),
    array(
      8,
      0.5,
    ),
  ));
  $d2->label = t('Example data 2');
  $d2->lines = new flotLine();
  $d2->points = new flotPoint();
  $d2->bars = new flotBar();
  $variables = array(
    'data' => array(
      $d1,
      $d2,
    ),
    'element' => array(
      'id' => 'flot-example-normal',
      'class' => 'flot-example',
      'style' => "width:600px;height:400px",
    ),
    // Show a legend
    'legend' => TRUE,
    // Make the graph zoomable (click and drag over the graph to zoom in on a part of that graph)
    'zoom' => TRUE,
  );
  $content .= theme('flot_graph', $variables);
  return $content;
}