【echarts折线图】详解 一、 折线效果 && 折线点效果

备忘:

关于折线图的 数据折线显示更多配置: https://echarts.baidu.com/option.html#series-line


	<script>
    option = {
        visualMap:{     //视觉映射  渐变过渡等效果
            show: false,
            type: 'continuous',
            seriesIndex: 0,
            min: 0,     //控制最小的数据显示色
            max: 60,    //控制最大的数据显示色
            // color:["#4C8400","#80BB0D","#B4DA20","#B6DA8C"], //折线渐变色 , 由大到小排序  ECharts2的用法,ECharts3用inRange,如下
            inRange: {
                color: ["#4C8400","#80BB0D","#B4DA20","#B6DA8C"],
                symbolSize: [30, 100]   //折线点的过渡大小, 从小到大
            }

        },
       tooltip: {	//鼠标移入效果
            trigger: 'axis',
            formatter: function(cur){	//formatter有  字符串模板 和 回调函数格式 两种
            	//详情: https://www.echartsjs.com/zh/option.html#series-line.tooltip.formatter

				//通过参数 cur 基本就可以获取想要的数据了,当然也可以自定义数据
                console.log(cur)
				
				//最后把要展示的数据记得用return 出来
                return 
            }
        },
        xAx
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值