Drupal: unable to set labels for x axis using Charts module

Question

I want to create a line chart displaying changes in share price over the time using Drupal Charts 7.x-2.0-rc1 API and Google Charts as a library. I tried the following code and populated the chart with some random values:

$chart = array(
    '#type' => 'chart',
    '#chart_type' => 'line',
    '#chart_library' => 'google',
    '#title' => t(''),
    '#legend' => FALSE,
    '#colors' => array('FF6600'),
    '#width' => 480,
    '#height' => 240,
    '#data_labels' => TRUE,
    '#raw_options' => array(
        'vAxis' => array(
            'viewWindowMode' => 'explicit',
            'viewWindow' => array(
                'min' => 1,
            ),
        ),
        'hAxis' => array(
            'showTextEvery' => 20
        )
    ),
);

$data = array();
for ($i = 0; $i < 100; $i++) {
    $data[$i] = array(date('H:i', strtotime("+$i minute")), (rand(5, 10) / 10) * 6);
}

$chart['price'] = array(
    '#type' => 'chart_data',
    '#title' => t('Share price'),
    '#show_in_legend' => FALSE,
    '#data' => $data,
    '#decimal_count' => 2,
);

$shareChart['chart'] = $chart;

return drupal_render($shareChart);

I get the following output: chart

I want the x axis to display only cerain labels (in this example interval of 20 minutes) but 'showTextEvery' option doesn't work. Any ideas why? Maybe there is another way to achive that?

Have you checked the Drupal settings object in the generated page? That will allow you to check if the module is passing the variables through correctly (or at least as you expect). — acrosman
not sure what you mean as I've been using Drupal for two days now but as I wrote in a comment below: I've inspected the page with FireBug and I can see my custom options for vAxis passed to html but not for hAxis (tried sth simple like textStyle) so I think the problem lies somewhere in my chart configuration or Drupal's Chart module — panblacha

WhiteHat WhiteHat · Accepted Answer · 2016-06-29T12:21:54

date/time values on the hAxis result in a continuous axis

'showTextEvery' only works for a discrete axis, resulting from string values

see discrete vs continuous

as such, you would need to provide your own ticks

maybe try something like this, generate the data, along with the ticks, first...

$data = array();
$ticks = array();
$x = 0;
for ($i = 0; $i < 100; $i++) {
    $data[$i] = array(date('H:i', strtotime("+$i minute")), (rand(5, 10) / 10) * 6);
    if ($i % 20 == 0) {
        $ticks[$x] = date('H:i', strtotime("+$i minute"));
        $x++;
    }
}

then in the chart definition...

$chart = array(
    'hAxis' => array(
        'ticks' => $ticks
    )

Drupal: unable to set labels for x axis using Charts module

1 Answers