如何将自定义选项传递到chartjs

时间:2019-01-24 19:36:42

标签: vue.js chart.js

我试图能够在图表中添加注释,但是我仍在坚持如何将个人的光子对象传递到chartOptions变量中以便在工具提示标签函数中使用?

<template>

<swiper-slide v-for="(photon,key) in $store.state.photons" :key='key'>

 <line-chart width="80vw" :dataset="dataset" :library="chartOptions" class="animated slideInLeft delay-0.01s"
                    v-else :data="photon.data.rbChannel" ytitle="R/B Channel" :download="true"></line-chart>
<line-chart width="80vw" :dataset="dataset" :library="chartOptions" class="animated slideInRight delay-0.01s"
                    v-else :data="photon.data.tempF" ytitle="Temperature F" :colors="['#ff0000']" :download="true"></line-chart>
        </swiper-slide>
</template>

chartOptions变量

chartOptions: {
                    tooltips: {
                        callbacks: {
                            label: function (tooltipItem, data) {
                                console.log(data.labels[tooltipItem.index])
                                console.log(tooltipItem)
                                return data.labels[tooltipItem.index]
                            }
                        }
                    },
                    height: '400px',
                    pan: {
                        enabled: false,
                        mode: 'xy',
                    },
                    zoom: {
                        enabled: true,
                        mode: 'x',
                    },
                    drag: true,
                    gridLines: {
                        zeroLineColor: "rgba(0,255,0,1)"
                    }
                }

0 个答案:

没有答案