SyntaxHighlighterの代替 google-code-prettifyのテスト

先日、ソースコードをブログ上で表示する為に"SyntaxHighlighter"を導入したわけですが、導入後にブログをIEで表示するとhighchartsのグラフがきちんと表示されなくなりました(chromeやfirefoxではしっかり表示されます)。highcharts API Referenceをいくつか試した後にこの症状が出たので、当初はこのAPIが悪さしているのかと思い色々調べていたのですが原因が解らず放置…。そして今日、気を取り直してまた色々試していると、SyntaxHighlighter導入の為に追加したタグ等を取りのぞいてみると症状が治る事がわかりました。具体的に何処が原因なのかはわからないのですが、SyntaxHighlighterを使う為にブログのHTMLに追加した部分がhighchartsに悪い干渉をもたらしていたようです。

ただ、SyntaxHighlighterが使えないとソースコードをブログ上に表示できなくなるので代替の物を探してみたところ、"google-code-prettify"というものを見つけました。STUDY-NETおぼえがきさんの記事を参考に導入してみたところいい感じです。SyntaxHighlighterのように行番号は出ませんが、こちらは軽いしシンプルでいい感じです。ハイライトもされますし。google-code-prettifyは、highchartsにも干渉しないのでこのままgoogle-code-prettifyを使わせてもらおうと思います。

今回もIEにはあらぬ苦労をさせられました。
今後は新しい機能を追加する時はIEの動向をしっかりチェックしようと思います^^;


public class HelloWorld {
  public static void main(String[] args) {
    System.out.println("Hello World");
  }
}
$(function () {
    var chart;
    $(document).ready(function() {
        chart = new Highcharts.Chart({
    
            chart: {
                renderTo: 'container481',
                type: 'area'
            },
    
            title: {
                text: '【海外・年別】 日本自動車メーカー 海外生産台数 推移'
            },
            subtitle: {
                text: ' 集計期間: 1999年 ~  source: '+'日本自動車工業会'
            },
            xAxis: [{
	           categories: ['1999年','','2001年','','2003年','','2005年','','2007年','','2009年','','2011年']
		}],
           yAxis: [{ 
		title: {
                text: '全世界店舗数'
                    },
        labels: {
				formatter: function() {
					return this.value /10000 +'万台';
				}
			}
          }],
関連記事
  
このエントリーをはてなブックマークに追加

イーロン・マスク 破壊者か創造神か (朝日文庫)
竹内一正
朝日新聞出版
売り上げランキング: 9,596

■よく読まれている人気記事


コメントの投稿

非公開コメント


author imageAuthor:Lynx
各データの推移を見守り中。
御連絡はこちらまでお願いします。



最新記事