Skip to content

I
incubator-echarts

z1593 / incubator-echarts
与 Fork 源项目一致

从无法访问的项目Fork

通知 1
Star 0
Fork 0
I
incubator-echarts

体验新版 GitCode，发现更多精彩内容 >>

未验证 提交 6b4f8950 编写于 作者: W Wenli Zhang 提交者： GitHub
浏览文件
操作

Merge pull request #18524 from juliepagano/fix-18495 

feat(axisPointer): add option to disable emphasis. close #18495
上级 f5bb3b0c 8041cde9
隐藏空白更改
内联 并排
Showing with 225 addition and 4 deletion
src/component/axisPointer/AxisPointerModel.ts
浏览文件 @ 6b4f8950
......@@ -88,6 +88,7 @@ class AxisPointerModel extends ComponentModel<AxisPointerOption> {
// see `modelHelper`.
snap: false,
triggerTooltip: true,
triggerEmphasis: true,
value: null,
status: null, // Init value depends on whether handle is used.
......
src/component/axisPointer/axisTrigger.ts
浏览文件 @ 6b4f8950
......@@ -462,7 +462,7 @@ function dispatchHighDownActually(
// Build hash map and remove duplicate incidentally.
each(axesInfo, function (axisInfo, key) {
const option = axisInfo.axisPointerModel.option;
option.status === 'show' && each(option.seriesDataIndices, function (batchItem) {
option.status === 'show' && axisInfo.triggerEmphasis && each(option.seriesDataIndices, function (batchItem) {
const key = batchItem.seriesIndex + ' | ' + batchItem.dataIndex;
newHighlights[key] = batchItem;
});
......
src/component/axisPointer/modelHelper.ts
浏览文件 @ 6b4f8950
......@@ -49,6 +49,7 @@ interface AxisInfo {
coordSys: CoordinateSystemMaster
axisPointerModel: Model<CommonAxisPointerOption>
triggerTooltip: boolean
triggerEmphasis: boolean
involveSeries: boolean
snap: boolean
useHandle: boolean
......@@ -87,6 +88,7 @@ export function collect(ecModel: GlobalModel, api: ExtensionAPI) {
* coordSys,
* axisPointerModel,
* triggerTooltip,
* triggerEmphasis,
* involveSeries,
* snap,
* seriesModels,
......@@ -194,6 +196,7 @@ function collectAxesInfo(result: CollectionResult, ecModel: GlobalModel, api: Ex
: axisPointerModel;
const snap = axisPointerModel.get('snap');
const triggerEmphasis = axisPointerModel.get('triggerEmphasis');
const axisKey = makeKey(axis.model);
const involveSeries = triggerTooltip || snap || axis.type === 'category';
......@@ -204,6 +207,7 @@ function collectAxesInfo(result: CollectionResult, ecModel: GlobalModel, api: Ex
coordSys: coordSys,
axisPointerModel: axisPointerModel,
triggerTooltip: triggerTooltip,
triggerEmphasis: triggerEmphasis,
involveSeries: involveSeries,
snap: snap,
useHandle: isHandleTrigger(axisPointerModel),
......
src/util/types.ts
浏览文件 @ 6b4f8950
......@@ -1376,6 +1376,8 @@ export interface CommonAxisPointerOption {
triggerTooltip?: boolean
triggerEmphasis?: boolean
/**
* current value. When using axisPointer.handle, value can be set to define the initial position of axisPointer.
*/
......
test/runTest/actions/__meta__.json
浏览文件 @ 6b4f8950
......@@ -188,7 +188,7 @@
"tooltip": 10,
"tooltip-appendToBody": 4,
"tooltip-axisPointer": 20,
"tooltip-axisPointer2": 2,
"tooltip-axisPointer2": 4,
"tooltip-cascade": 4,
"tooltip-component": 6,
"tooltip-domnode": 1,
......
test/runTest/actions/tooltip-axisPointer2.json
浏览文件 @ 6b4f8950
[{"name":"Action 1","ops":[{"type":"mousemove","time":530,"x":31,"y":450},{"type":"mousemove","time":736,"x":57,"y":450},{"type":"mousemove","time":959,"x":82,"y":449},{"type":"mousemove","time":1163,"x":92,"y":447},{"type":"mousemove","time":1389,"x":93,"y":447},{"type":"mousemove","time":1634,"x":93,"y":447},{"type":"mousemove","time":1835,"x":114,"y":448},{"type":"mousemove","time":2051,"x":131,"y":448},{"type":"mousemove","time":2278,"x":142,"y":448},{"type":"mousemove","time":2522,"x":145,"y":447},{"type":"mousemove","time":3210,"x":148,"y":447},{"type":"mousemove","time":3428,"x":155,"y":445},{"type":"mousemove","time":3631,"x":156,"y":445},{"type":"mousemove","time":3834,"x":164,"y":445},{"type":"mousemove","time":4048,"x":183,"y":442},{"type":"mousemove","time":4251,"x":212,"y":439},{"type":"mousemove","time":4459,"x":221,"y":439},{"type":"mousemove","time":4662,"x":222,"y":439},{"type":"mousemove","time":4803,"x":224,"y":439},{"type":"mousemove","time":5005,"x":256,"y":435},{"type":"mousemove","time":5209,"x":281,"y":433},{"type":"mousemove","time":5411,"x":303,"y":433},{"type":"mousemove","time":5718,"x":307,"y":433},{"type":"mousemove","time":5933,"x":328,"y":431},{"type":"mousemove","time":6147,"x":352,"y":430},{"type":"mousemove","time":6373,"x":360,"y":430},{"type":"mousemove","time":6605,"x":361,"y":430},{"type":"mousemove","time":6949,"x":361,"y":430},{"type":"mousemove","time":7182,"x":374,"y":430},{"type":"mousemove","time":7404,"x":401,"y":430},{"type":"mousemove","time":7642,"x":402,"y":430},{"type":"mousemove","time":7821,"x":405,"y":430},{"type":"mousemove","time":8024,"x":418,"y":430},{"type":"mousemove","time":8251,"x":430,"y":430},{"type":"mousemove","time":8674,"x":434,"y":430},{"type":"mousemove","time":8903,"x":448,"y":431},{"type":"mousemove","time":9104,"x":498,"y":424},{"type":"mousemove","time":9330,"x":506,"y":424},{"type":"mousemove","time":9773,"x":511,"y":424},{"type":"mousemove","time":9995,"x":523,"y":426},{"type":"mousemove","time":10207,"x":543,"y":424},{"type":"mousemove","time":10415,"x":570,"y":422},{"type":"mousemove","time":10649,"x":577,"y":422},{"type":"mousemove","time":10921,"x":581,"y":422},{"type":"mousemove","time":11149,"x":645,"y":419},{"type":"mousemove","time":11375,"x":646,"y":418}],"scrollY":0,"scrollX":0,"timestamp":1573747705006},{"name":"Action 2","ops":[{"type":"mousedown","time":505,"x":316,"y":288},{"type":"mouseup","time":619,"x":316,"y":288},{"time":620,"delay":400,"type":"screenshot-auto"},{"type":"mousemove","time":796,"x":316,"y":288},{"type":"mousemove","time":997,"x":455,"y":295},{"type":"mousedown","time":1172,"x":455,"y":295},{"type":"mouseup","time":1304,"x":455,"y":295},{"time":1305,"delay":400,"type":"screenshot-auto"}],"scrollY":410,"scrollX":0,"timestamp":1620804726835}]
\ No newline at end of file
[{"name":"Action 1","ops":[{"type":"mousemove","time":530,"x":31,"y":450},{"type":"mousemove","time":736,"x":57,"y":450},{"type":"mousemove","time":959,"x":82,"y":449},{"type":"mousemove","time":1163,"x":92,"y":447},{"type":"mousemove","time":1389,"x":93,"y":447},{"type":"mousemove","time":1634,"x":93,"y":447},{"type":"mousemove","time":1835,"x":114,"y":448},{"type":"mousemove","time":2051,"x":131,"y":448},{"type":"mousemove","time":2278,"x":142,"y":448},{"type":"mousemove","time":2522,"x":145,"y":447},{"type":"mousemove","time":3210,"x":148,"y":447},{"type":"mousemove","time":3428,"x":155,"y":445},{"type":"mousemove","time":3631,"x":156,"y":445},{"type":"mousemove","time":3834,"x":164,"y":445},{"type":"mousemove","time":4048,"x":183,"y":442},{"type":"mousemove","time":4251,"x":212,"y":439},{"type":"mousemove","time":4459,"x":221,"y":439},{"type":"mousemove","time":4662,"x":222,"y":439},{"type":"mousemove","time":4803,"x":224,"y":439},{"type":"mousemove","time":5005,"x":256,"y":435},{"type":"mousemove","time":5209,"x":281,"y":433},{"type":"mousemove","time":5411,"x":303,"y":433},{"type":"mousemove","time":5718,"x":307,"y":433},{"type":"mousemove","time":5933,"x":328,"y":431},{"type":"mousemove","time":6147,"x":352,"y":430},{"type":"mousemove","time":6373,"x":360,"y":430},{"type":"mousemove","time":6605,"x":361,"y":430},{"type":"mousemove","time":6949,"x":361,"y":430},{"type":"mousemove","time":7182,"x":374,"y":430},{"type":"mousemove","time":7404,"x":401,"y":430},{"type":"mousemove","time":7642,"x":402,"y":430},{"type":"mousemove","time":7821,"x":405,"y":430},{"type":"mousemove","time":8024,"x":418,"y":430},{"type":"mousemove","time":8251,"x":430,"y":430},{"type":"mousemove","time":8674,"x":434,"y":430},{"type":"mousemove","time":8903,"x":448,"y":431},{"type":"mousemove","time":9104,"x":498,"y":424},{"type":"mousemove","time":9330,"x":506,"y":424},{"type":"mousemove","time":9773,"x":511,"y":424},{"type":"mousemove","time":9995,"x":523,"y":426},{"type":"mousemove","time":10207,"x":543,"y":424},{"type":"mousemove","time":10415,"x":570,"y":422},{"type":"mousemove","time":10649,"x":577,"y":422},{"type":"mousemove","time":10921,"x":581,"y":422},{"type":"mousemove","time":11149,"x":645,"y":419},{"type":"mousemove","time":11375,"x":646,"y":418}],"scrollY":0,"scrollX":0,"timestamp":1573747705006},{"name":"Action 2","ops":[{"type":"mousedown","time":505,"x":316,"y":288},{"type":"mouseup","time":619,"x":316,"y":288},{"time":620,"delay":400,"type":"screenshot-auto"},{"type":"mousemove","time":796,"x":316,"y":288},{"type":"mousemove","time":997,"x":455,"y":295},{"type":"mousedown","time":1172,"x":455,"y":295},{"type":"mouseup","time":1304,"x":455,"y":295},{"time":1305,"delay":400,"type":"screenshot-auto"}],"scrollY":410,"scrollX":0,"timestamp":1620804726835},{"name":"Action 3","ops":[{"type":"mousemove","time":941,"x":790,"y":332},{"type":"mousemove","time":1141,"x":679,"y":307},{"type":"mousemove","time":1341,"x":657,"y":298},{"type":"mousemove","time":1541,"x":644,"y":293},{"type":"mousemove","time":1741,"x":644,"y":293},{"type":"mousemove","time":1875,"x":641,"y":292},{"type":"mousemove","time":2079,"x":620,"y":285},{"type":"mousemove","time":2294,"x":619,"y":285},{"type":"screenshot","time":3346},{"type":"mousemove","time":4041,"x":619,"y":282},{"type":"mousemove","time":4241,"x":614,"y":209},{"type":"mousemove","time":4441,"x":615,"y":204},{"type":"mousemove","time":4645,"x":618,"y":199},{"type":"mousemove","time":4862,"x":618,"y":198},{"type":"screenshot","time":5279}],"scrollY":1022,"scrollX":0,"timestamp":1681767847541},{"name":"Action 4","ops":[{"type":"mousemove","time":504,"x":796,"y":353},{"type":"mousemove","time":708,"x":701,"y":358},{"type":"mousemove","time":920,"x":621,"y":372},{"type":"mousemove","time":1103,"x":614,"y":372},{"type":"mousemove","time":1307,"x":545,"y":380},{"type":"mousemove","time":1519,"x":593,"y":382},{"type":"mousemove","time":1723,"x":596,"y":382},{"type":"mousemove","time":1920,"x":596,"y":382},{"type":"mousemove","time":2123,"x":594,"y":382},{"type":"screenshot","time":4060},{"type":"mousemove","time":4336,"x":594,"y":381},{"type":"mousemove","time":4540,"x":610,"y":325},{"type":"mousemove","time":4752,"x":614,"y":313},{"type":"mousemove","time":4957,"x":614,"y":310},{"type":"mousemove","time":5137,"x":614,"y":311},{"type":"mousemove","time":5342,"x":615,"y":315},{"type":"screenshot","time":6509}],"scrollY":1385,"scrollX":0,"timestamp":1681767886629}]
\ No newline at end of file
test/tooltip-axisPointer2.html
浏览文件 @ 6b4f8950
......@@ -39,7 +39,8 @@ under the License.
<div id="main0"></div>
<div id="main1"></div>
<div id="main2"></div>
<div id="main3"></div>
<div id="main4"></div>
<script>
......@@ -1590,5 +1591,218 @@ under the License.
</script>
<script>
var option;
require([
'echarts'
], function (echarts) {
option = {
tooltip: {
trigger: "axis",
},
legend: {
data: ["Email", "Union Ads", "Video Ads", "Direct", "Search Engine"]
},
grid: {
left: "3%",
right: "4%",
bottom: "3%",
containLabel: true
},
xAxis: {
type: "category",
boundaryGap: false,
data: ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"],
axisPointer: {
triggerEmphasis: true
}
},
yAxis: {
type: "value",
},
series: [
{
name: "Email",
type: "line",
stack: "Total",
data: [120, 132, 101, 134, 90, 230, 210],
emphasis: {
focus: "series",
lineStyle: {
width: 10
}
}
},
{
name: "Union Ads",
type: "line",
stack: "Total",
data: [220, 182, 191, 234, 290, 330, 310],
emphasis: {
focus: "series",
lineStyle: {
width: 10
}
}
},
{
name: "Video Ads",
type: "line",
stack: "Total",
data: [150, 232, 201, 154, 190, 330, 410],
emphasis: {
focus: "series",
lineStyle: {
width: 10
}
}
},
{
name: "Direct",
type: "line",
stack: "Total",
data: [320, 332, 301, 334, 390, 330, 320],
emphasis: {
focus: "series",
lineStyle: {
width: 10
}
}
},
{
name: "Search Engine",
type: "line",
stack: "Total",
data: [820, 932, 901, 934, 1290, 1330, 1320],
emphasis: {
focus: "series",
lineStyle: {
width: 10
}
}
}
]
};
var chart = testHelper.create(echarts, 'main3', {
title: [
'tooltip.axisPointer.triggerEmphasis: true',
'all lines should highlight on mouseover with axis pointer'
],
option: option
});
});
</script>
<script>
var option;
require([
'echarts'
], function (echarts) {
option = {
tooltip: {
trigger: "axis",
},
legend: {
data: ["Email", "Union Ads", "Video Ads", "Direct", "Search Engine"]
},
grid: {
left: "3%",
right: "4%",
bottom: "3%",
containLabel: true
},
xAxis: {
type: "category",
boundaryGap: false,
data: ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"],
axisPointer: {
triggerEmphasis: false
}
},
yAxis: {
type: "value",
},
series: [
{
name: "Email",
type: "line",
stack: "Total",
data: [120, 132, 101, 134, 90, 230, 210],
emphasis: {
focus: "series",
lineStyle: {
width: 10
}
}
},
{
name: "Union Ads",
type: "line",
stack: "Total",
data: [220, 182, 191, 234, 290, 330, 310],
emphasis: {
focus: "series",
lineStyle: {
width: 10
}
}
},
{
name: "Video Ads",
type: "line",
stack: "Total",
data: [150, 232, 201, 154, 190, 330, 410],
emphasis: {
focus: "series",
lineStyle: {
width: 10
}
}
},
{
name: "Direct",
type: "line",
stack: "Total",
data: [320, 332, 301, 334, 390, 330, 320],
emphasis: {
focus: "series",
lineStyle: {
width: 10
}
}
},
{
name: "Search Engine",
type: "line",
stack: "Total",
data: [820, 932, 901, 934, 1290, 1330, 1320],
emphasis: {
focus: "series",
lineStyle: {
width: 10
}
}
}
]
};
var chart = testHelper.create(echarts, 'main4', {
title: [
'tooltip.axisPointer.triggerEmphasis: false',
'lines should only highlight individually on exact mouseover of the line'
],
option: option
});
});
</script>
</body>
</html>
\ No newline at end of file
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或