좋아하는 매개변수를 Highcharts에게 전달하는 방법

너 뭐 하고 싶어?

Highcharts 툴팁 때문에 차트의 값을 원하는 대로 표시할 수 있습니다.
매우 편리합니다.저도 좋아해요.
사용 중
툴팁에는 "차트 값 이외의 값도 꺼내고 싶다!"이런 욕망이 생겼다.
나는 그때의 해결 방법을 쓰고 싶다.

해결책

-- 해결 전--

스트라이프를 출력할 때 다음 코드를 쓸 수 있을 것 같습니다.

<!--通常の棒グラフ-->
<div class="subTitle">
    <h2>通常の棒グラフ</h2>
</div>
<div class="chartArea" id="chart1"></div>

<!--サンプルスクリプト-->
<script type="text/javascript">
$(function () {
    $('#chart1').highcharts({
        chart: {
            type: 'column'
        },
        xAxis: {
            categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
        },
        plotOptions: {
            series: {
                allowPointSelect: true
            }
        },
        series: [{
            data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]
        }]
    });
});
</script>

-- 해결 후--

우선 데이터를 지정할 때 '연상 배열' 을 사용합니다.
API 참조(항목 3) 참조
그리고 배열에 자신의 속성을 정의하고 그 안에 데이터를 쓰면 DONE!!
다음에 도구 알림 옵션만 사용해서 호출합니다.(point Format 섹션)

<!--複数パラメータを渡した棒グラフ-->
<div class="subTitle">
    <h2>複数パラメータを渡した棒グラフ</h2>
</div>
<div class="chartArea" id="chart2"></div>

<!--サンプルスクリプト-->
<script type="text/javascript">
    $(function () {
        $('#chart2').highcharts({
            chart: {
                type: 'column'
            },
            xAxis: {
                categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
            },
            plotOptions: {
                series: {
                    allowPointSelect: true
                }
            },
            tooltip: {
                pointFormat: '{series.name}: <b>{point.y}</b><br/><b>{point.exParam}</b><br/>',
                shared: true
            },
            series: [{
                data: [
                    {
                        y: 29.9,
                        exParam: 'sample1!'
                    }, {
                        y: 71.5,
                        exParam: 'sample2!'
                    }, {
                        y: 106.4,
                        exParam: 'sample3!'
                    }, {
                        y: 129.2,
                        exParam: 'sample4!'
                    }, {
                        y: 144.0,
                        exParam: 'sample5!'
                    }, {
                        y: 176.0,
                        exParam: 'sample6!'
                    }, {
                        y: 135.6,
                        exParam: 'sample7!'
                    }, {
                        y: 148.5,
                        exParam: 'sample8!'
                    }, {
                        y: 216.4,
                        exParam: 'sample9!'
                    }, {
                        y: 194.1,
                        exParam: 'sample10!'
                    }, {
                        y: 95.6,
                        exParam: 'sample11!'
                    }, {
                        y: 54.4,
                        exParam: 'sample12!'
                    }
                ]
            }]
        });
    });
</script>

이상은 필기였습니다.