blocks|key|109920|text|Pawel的建议|type|unstyled|depth|inlineStyleRanges|entityRanges|data|109921|chart.xAxis[0].setExtremes(null,null);|code-block|syntax|javascript|109922|工作吗，顺便说一句，如下所示：http://jsfiddle.net/tvHg6/|offset|length|109923|但是，虽然图表缩小了，但resetZoom按钮仍然存在，不确定如何隐藏它。调用chart.resetZoomButton.hide()会隐藏它，但它会永久地这样做。|109924|entityMap|0|LINK|mutability|MUTABLE|url|http://jsfiddle.net/tvHg6/^0|0|0|F|Q|0|0|0^^$0|@$1|2|3|4|5|6|7|U|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|V|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|W|8|@]|9|@$I|X|J|Y|1|Z]]|A|$]]|$1|K|3|L|5|6|7|10|8|@]|9|@]|A|$]]|$1|M|3|-4|5|6|7|11|8|@]|9|@]|A|$]]]|N|$O|$5|P|Q|R|A|$S|T]]]]

Pawel's suggestion of calling

<pre><code>chart.xAxis[0].setExtremes(null,null);
</code></pre>

does work, btw, as shown here: <a href="http://jsfiddle.net/tvHg6/">http://jsfiddle.net/tvHg6/</a>

However, although the chart zooms out, the resetZoom button is still hanging around, not sure how to hide it. Calling chart.resetZoomButton.hide() hides it, but it does so permanently.

blocks|key|4915956|text|如建议的here|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|4915957|chart.zoom()|code-block|syntax|javascript|4915958|但请记住，调用chart.zoom()不会触发chart.events.selection事件。如果您手动或通过编程$('.highcharts-button').click();单击"Reset+button“，则会触发此操作|style|CODE|4915959|entityMap|0|LINK|mutability|MUTABLE|url|https://stackoverflow.com/a/29026981/1280252^0|4|4|0|0|0|7|C|N|M|1M|W|0^^$0|@$1|2|3|4|5|6|7|U|8|@]|9|@$A|V|B|W|1|X]]|C|$]]|$1|D|3|E|5|F|7|Y|8|@]|9|@]|C|$G|H]]|$1|I|3|J|5|6|7|Z|8|@$A|10|B|11|K|L]|$A|12|B|13|K|L]|$A|14|B|15|K|L]]|9|@]|C|$]]|$1|M|3|-4|5|6|7|16|8|@]|9|@]|C|$]]]|N|$O|$5|P|Q|R|C|$S|T]]]]

As suggested <a href="https://stackoverflow.com/a/29026981/1280252">here</a>

<pre><code>chart.zoom()
</code></pre>

But keep in mind that calling <code>chart.zoom()</code> does not trigger <code>chart.events.selection</code> event. Which is triggered if you click on "Reset button" manually or programmatically <code>$('.highcharts-button').click();</code>

blocks|key|2023843|text|如果要在外部按钮上重置缩放，请单击，然后执行以下操作：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|2023844|$("#YourOwnZoomBtnID").click(function(){+

++++$('.highcharts-button').click();
});|code-block|syntax|javascript|2023845|如果你想隐藏highcharts内置的重置按钮，你可以这样做：|2023846|xAxis:+{+categories:+xAxisCategories
++++++++++++++++,events:+{
++++++afterSetExtremes:+function()+{
++++++++$('.highcharts-button').hide();
++++++}
++++}}|2023847|jsfiddle示例如下：jsfiddle|offset|length|2023848|谢谢Kalyan|2023849|entityMap|0|LINK|mutability|MUTABLE|url|http://jsfiddle.net/fj6d2/3572/^0|0|0|0|0|D|8|0|0|0^^$0|@$1|2|3|4|5|6|7|Y|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|Z|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|10|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|11|8|@]|9|@]|A|$E|F]]|$1|K|3|L|5|6|7|12|8|@]|9|@$M|13|N|14|1|15]]|A|$]]|$1|O|3|P|5|6|7|16|8|@]|9|@]|A|$]]|$1|Q|3|-4|5|6|7|17|8|@]|9|@]|A|$]]]|R|$S|$5|T|U|V|A|$W|X]]]]

If you want to reset the zoom on an external button click then do it as follows:

<pre><code>$("#YourOwnZoomBtnID").click(function(){ 

 $('.highcharts-button').click();
});
</code></pre>

If you want to hide the Inbuilt Reset Button of highcharts then you can do it as follows:

<pre><code>xAxis: { categories: xAxisCategories
 ,events: {
 afterSetExtremes: function() {
 $('.highcharts-button').hide();
 }
 }}
</code></pre>

jsfiddle example is here: <a href="http://jsfiddle.net/fj6d2/3572/" rel="nofollow" title="jsfiddle">jsfiddle</a>

Thanks
Kalyan

blocks|key|109979|text|我刚刚调用了按钮的click事件，它工作得很好。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|109980|给定:+v_chart是高线图的变量；|109981|if+(typeof+v_chart.resetZoomButton+!==+'undefined')+{
++++v_chart.resetZoomButton.element.onclick();
}|code-block|syntax|javascript|109982|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|L|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|M|8|@]|9|@]|A|$G|H]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

I just called the button's click event and it worked fine.

given: v_chart is variable for Highcharts chart;

<pre><code>if (typeof v_chart.resetZoomButton !== 'undefined') {
 v_chart.resetZoomButton.element.onclick();
}
</code></pre>

blocks|key|4916060|text|type|unstyled|depth|inlineStyleRanges|entityRanges|data|4916061|隐藏|ordered-list-item|4916062|的原始重置按钮|4916063|主题图表：{+resetZoomButton：{+|4916064|：{+display：'none‘}|blockquote|4916065|4916066|4916067|4916068|处理event+|4916069|4916070|符号按钮：{+|4916071|：{+resetButton：'url(redo_icon.svg)'，_titleKey："resetZoom"，y:+20，x：-20，onclick:函数()+{+this.xAxis.setExtremes(null，null)；this.yAxis.setExtremes(null，null)+}|4916072|4916073|entityMap^0|0|0|0|0|0|0|0|0|0|0|0|0|0^^$0|@$1|2|3|-4|4|5|6|X|7|@]|8|@]|9|$]]|$1|A|3|B|4|C|6|Y|7|@]|8|@]|9|$]]|$1|D|3|E|4|5|6|Z|7|@]|8|@]|9|$]]|$1|F|3|G|4|5|6|10|7|@]|8|@]|9|$]]|$1|H|3|I|4|J|6|11|7|@]|8|@]|9|$]]|$1|K|3|-4|4|5|6|12|7|@]|8|@]|9|$]]|$1|L|3|-4|4|5|6|13|7|@]|8|@]|9|$]]|$1|M|3|-4|4|5|6|14|7|@]|8|@]|9|$]]|$1|N|3|O|4|C|6|15|7|@]|8|@]|9|$]]|$1|P|3|-4|4|5|6|16|7|@]|8|@]|9|$]]|$1|Q|3|R|4|5|6|17|7|@]|8|@]|9|$]]|$1|S|3|T|4|J|6|18|7|@]|8|@]|9|$]]|$1|U|3|-4|4|5|6|19|7|@]|8|@]|9|$]]|$1|V|3|-4|4|5|6|1A|7|@]|8|@]|9|$]]]|W|$]]

<ol>
<li>hide the original reset button </li>
</ol>

<blockquote>
<pre><code> chart: {
 resetZoomButton: {
 theme: {
 display: 'none'
 }
 }
 }
</code></pre>
</blockquote>

<ol start="2">
<li>take care of the event </li>
</ol>

<blockquote>
<pre><code> buttons: {
 resetButton: {
 symbol: 'url(redo_icon.svg)',
 _titleKey: "resetZoom",
 y: 20,
 x: -20,
 onclick: function () {
 this.xAxis[0].setExtremes(null,null);
 this.yAxis[0].setExtremes(null,null)
 }
 }
 }
</code></pre>
</blockquote>

blocks|key|110020|text|我们有一个类似的情况-用户缩放，我们添加了一个‘保存此缩放阶段’按钮，用户单击该按钮，我们保存新的最小/最大时间，但现在我们必须使重置缩放按钮消失。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|110021|这段代码做到了，如果用户进一步放大，按钮将返回：|110022|chart.resetZoomButton.hide();
chart.resetZoomButton+=+chart.resetZoomButton.destroy();|code-block|syntax|javascript|110023|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|L|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|M|8|@]|9|@]|A|$G|H]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

We had a similar situation - user zooms, we add a 'save this zoom stage' button, user clicks the button, we save the new min/max time, but now we have to make the reset zoom button disappear.
This code did it and the button returns if the user zooms even further afterwards:
<pre><code>chart.resetZoomButton.hide();
chart.resetZoomButton = chart.resetZoomButton.destroy();
</code></pre>

I have a chart where i allowed zooming in/out. 
Each time user zoom in/out "Reset Zoom" appears.

Now I have added a new customize button where i need to show X most updated column data.
I have changed categories and data, but need also to reset the zoom.

Can this be done ? I still want to keep the "Reset Zoom" when user tries to zoom in/out.
PS: I tried doing this.zoomOut() but then the "Reset Zoom" appeared :(

Regards
Chanan

Calling Reset Zoom manually

翻译质量差，导致语言生硬或混乱。

没有提供实际的解决方法或示例。

解答不清晰，无法理解或解决问题。

页面排版不美观，阅读体验差。

文章

问答

视频

学习中心

腾讯云实验室

直播

竞赛

腾讯云代码分析专区

腾讯iOA零信任安全管理系统专区

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋

腾讯云代码助手

云原生构建

TAPD 敏捷项目管理

Cloud Studio

SDK中心

API中心

命令行工具

涵盖代码开发、场景应用、自动测试全流程，助你从零构建专属AI助手

一站式MCP教程库，解锁AI应用新玩法

我有一个图表，我允许放大/缩小。每次用户放大/缩小时，都会出现"Reset Zoom“。现在，我添加了一个新的customize按钮，我需要在其中显示X个最新的列数据。我已经更改了类别和数据，但也需要重置缩放。这可以做到吗？当用户尝试放大/缩小时，我仍然希望保留"Reset Zoom“。PS:我试着做this.zoomOut()，但是"Reset Zoom“出现了:(问候Chanan

问手动调用Reset Zoom
EN

回答 6

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问手动调用Reset ZoomEN

回答 6

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问手动调用Reset Zoom
EN