2016-07-07 7 views
1

Echarts.jsライブラリ - 私は別のページにパイのハイパーリンクで各スライスをしたいと思い、私は、円グラフのため</p> <p>をecharts.jsライブラリを使用しています円スライス用のonclickイベントを使用して参照ページ

静的データポイントを使用して、動作するかどうかをテストし、後で動的データに更新します。

以下は、pie1aの例です。私はT2、T2、T4、N/Aが自分のページを参照したいと思っています。 T2 = "http://localhost/T2.html"。

// ECHART_PIE1a

var echartPie1a = echarts.init(document.getElementById('echart_pie1a'), theme); 

    echartPie1a.setOption({ 
    tooltip: { 
     trigger: 'item', 
     formatter: "{a} <br/>{b} : {c} ({d}%)" 

    }, 




    legend: { 
     x: 'right', 
     y: 'bottom', 
     data: ['T2', 'T3', 'T4', 'N/A'] 
    }, 

    calculable: true, 
    series: [{ 
     name: '(TB)', 
     type: 'pie', 
     radius: '54%', 
     center: ['54%', '36%'], 
     data: [{ 

     value: 438, 
     name: 'T2' 
     }, { 
     value: 1109, 
     name: 'T3' 
     }, { 
     value: 42, 
     name: 'T4' 
     }, { 
     value: 389, 
     name: 'N/A' 

     }] 
    }] 
    }); 

答えて

1
echartPie1a.setOption(option); 
echartPie1a.on('click', function (params) 
{window.open('' + encodeURIComponent(params.name) + '.html', '_self'); 
}); 

トリックを行っているようです。

関連する問題