カテゴリー: Javascript

kashioka

Highchartsの棒グラフでX軸のラベルに時間を表示する。

棒グラフを表示するとtypeがdatetimeにしていても等間隔でラベルが表示されません。

その場合は


series: [{
type: 'column',
data: [[1413969960000,123.6],[1414009740000,73.4]],
pointRange: 4 * 3600 * 1000
}]

このようにpointRangeを指定します。

ちなみにtypeがlineやsplineの場合はpointRangeを指定しなくても

X軸のラベルは表示されます。

http://jsfiddle.net/u9jstkec/

kashioka

WordPressの子テーマでのJquery読込

jqueryやその他のJSファイル等を独自に読みこむ場合

[php]

<?php

wp_enqueue_script(‘jquery’);
wp_enqueue_script(‘lightbox’, get_stylesheet_directory_uri() . ‘/jquery/js/jquery.lightbox-0.5.js’, array(‘jquery’));
wp_enqueue_script(‘read_jquery’, get_stylesheet_directory_uri() . ‘/jquery/js/readjq.js’);
wp_enqueue_style(‘lightbox-css’, get_stylesheet_directory_uri() . ‘/jquery/css/jquery.lightbox-0.5.css’);
wp_head();

[/php]

このようにget_stylesheet_directory_uri()を使用する

blog_info(‘template_url’)を使用すると親テーマのディレクトリからの読込となる。

ちなみに上記の例の配置したディレクトリは

/wp-content/themas/テーマ名/jquery/

またwordpress内ではJSの$が処理出来ないため

js内の$をjQueryやJQuery等に変換して読み込ませることで、動作可能となります。

lightboxをwordpressと共に上記方法で使用する場合、画像が表示されない場合がある。

上記/jquery/の配下にjsとimagesディレクトリを作成した場合。

jquery.lightbox-0.5.jsの３０行目あたりを

[javascript]

imageLoading: ‘/wp-content/themes/two/jquery/images/lightbox-ico-loading.gif’, // (string) Path and the name of the loading icon
imageBtnPrev: ‘/wp-content/themes/two/jquery/images/lightbox-btn-prev.gif’, // (string) Path and the name of the prev button image
imageBtnNext: ‘/wp-content/themes/two/jquery/images/lightbox-btn-next.gif’, // (string) Path and the name of the next button image
imageBtnClose: ‘/wp-content/themes/two/jquery/images/lightbox-btn-close.gif’, // (string) Path and the name of the close btn
imageBlank: ‘/wp-content/themes/two/jquery/images/lightbox-blank.gif’, // (string) Path and the name of a blank image (one pixel)
// Configuration related to container image box

[javascript]

とすると表示されるようになる

WordPress.com でサイトを作成