Test axisYs　axisXs getAxisIndex

垂直線列位置配列axisYsと水平線行位置配列axisXs とgetAxisIndex

チャート領域をクリックしてみてください

<canvas id="hoge"></canvas>
<pre id="info"></pre>
<script>
var chartdata81 = {

  "config": {
    "title": "axisYsとaxisXsのテスト",
    "subTitle": "チャートグリッド内をクリックしてaxisYs情報を取得",
    "type": "line",
    "lineWidth": 1,
    "maxY": 100,
    "minY": 0,
    "useVal": "yes",
    "useMarker": "arc",
    "maxWsColLen": 18,
    "colorSet": ["#DDA0DD","#3CB000"]
  },

  "data": [
    ["年月", 2014, 2015, 2016],
    ["データ1",30,45,56],
    ["データ2",20,23,12]
  ]
};


var chart = 
      ccchart
        .init('hoge', chartdata81)

  //hogeをクリックしたときのイベントを設定する
  hoge.addEventListener('mousemove',function(e){
    //クリックした場所の垂直線列位置が何列目かなどの情報配列
    var col = ccchart.util.getAxisIndex('axisYs', e.offsetX);
    //クリックした場所の水平線行位置が何行目かなどの情報配列
    var row = ccchart.util.getAxisIndex('axisXs', e.offsetY);
    if(!(col === undefined || row === undefined)){
    

      info.innerHTML = ''
       // + '垂直列 ' +col[0] +' 本目'+ '\n'
       // + '水平行 ' +row[0] +' 本目'+ '\n'
       // + 'Yタイトルは '+ ccchart.axisYs[col[0]].yTitle+ '\n'
        + ccchart.wkdata[1][0] + 'の'+ccchart.axisYs[col[0]].yTitle+'は、' + ccchart.wkdata[1][col[0]]+ '\n'
       // + ccchart.wkdata[2][0] + 'は、' + ccchart.wkdata[2][col[0]]
        console.log(ccchart.axisYs[col[0]], ccchart.axisXs[[col[0]]], e.offsetY)
        
      ccchart
        .init('hoge', chartdata81)
        .memo({
            val: info.innerHTML,
            left: ccchart.axisYs[col[0]].left-100,
            top:  120,
            color: "orange",
            font: "100 20px 'serif'",
            lineTo: [ccchart.wkdata[1][0], ccchart.axisYs[col[0]].yTitle],
            lineToColor: 'orange'
        })
    }
  });

</script>