tooltip默认显示和句柄拖动设置

[Robotboy36]

One-line summary [问题简述]

1、如何让tooltip默认显示在指定的x轴刻度上？

2、如何在X轴增加句柄拖动tooltip， 在百度移动统计端有看到那种效果

Version & Environment [版本及环境]

• ECharts version [ECharts 版本]: 3.0
• Browser version [浏览器类型和版本]: chrome
• OS Version [操作系统类型和版本]: ios 和 安卓

Expected behaviour [期望结果]

ECharts option [ECharts配置项]

option = {
tooltip: {
            trigger: 'axis',
            alwaysShowContent:true,
            confine: true, 
            padding: 10,
            textStyle: {
                fontSize: 12
            },

            // 提示框中标尺线的样式
            axisPointer: {
                // animation: false,
                lineStyle: {
                    color: '#ffd200',
                    width: 1,
                    opacity: 1
                }
            }
        }
}

Other comments [其他信息]

[100pah]

1. 可以使用 http://echarts.baidu.com/api.html#action.tooltip.showTip
2. 你的图片我不能看到，不知是什么效果？

[Robotboy36]

[Robotboy36]

有实现办法吗？ 百度统计的移动端有这个效果，不知道是改的源代码还是api里面有这个配置

[sevenen]

我试了试，只有一个半成品，或者是一个思路。拖动小黑点是可以让句柄移动的。小黑点是可以隐藏的，有隐藏属性。每次拖动小黑点之后，也可以重新改变他的位置。现在还有很多问题。你看看能不能做出来。如果你用在线编辑的话，记得用这几个网址，其他的可能会出错。
[+] 开放图形元素设置：graphic。参见http://echarts.baidu.com/gallery/editor.html?c=line-y-category 和 http://echarts.baidu.com/gallery/editor.html?c=line-draggable 和 http://echarts.baidu.com/gallery/editor.html?c=map-province。
或者可以直接用graphic做整个的手柄。
`option = {
title: {
text: '未来一周气温变化',
subtext: '纯属虚构'
},
tooltip: {
trigger: 'axis'
},
legend: {
data:['最高气温','最低气温']
},
toolbox: {
show: true,
feature: {
dataZoom: {
yAxisIndex: 'none'
},
dataView: {readOnly: false},
magicType: {type: ['line', 'bar']},
restore: {},
saveAsImage: {}
}
},
grid:{},
xAxis: [ {
type: 'category',
boundaryGap: false,
data: ['周一','周二','周三','周四','周五','周六','周日']
}],
yAxis: [{
type: 'value',
axisLabel: {
formatter: '{value} °C'
}
}],
graphic:[{
type:'circle',
shape:{
cx:89.4,
cy:630,
r:10
},
zlevel:2,
draggable:'true',
ondragend:dragFunc,
invisible:false
}],
series: [
{
name:'最高气温',
type:'line',
data:[11, 11, 15, 13, 12, 13, 10],
markPoint: {
data: [
{type: 'max', name: '最大值'},
{type: 'min', name: '最小值'}
]
},
markLine: {
symbol:['pin',null],
symbolSize:[30,40],
data: [
{xAxis:0}
]
}
}
]
};
function dragFunc(){
var data0 = myChart.convertFromPixel('grid',[this.position[0],this.position[1]])[0];
myChart.setOption(
{
series:
[
{
markLine:{
data:[{
xAxis:data0
}]

                }
                
            }
        ]
        
    }
);

}
`

[Robotboy36]

@sevenen 非常感谢，我试试先

[100pah]

v3.5 已支持。参见 http://echarts.baidu.com/demo.html#candlestick-touch