Antv G2 very axis display time, tooltip display time period method

demand

• To display time points on the horizontal axis of the chart, the tooltip displays the time period as shown below:

The solution

• My first thought was to modify the title in the tooltip so that it appeared differently depending on the time on the horizontal axis, but I tried and failed.
• Later, we changed our thinking. Chart in G2 can have multiple views, so now we don’t show the horizontal axis of the displayed image, and the corresponding tooltip is the time period. Then you add a view that shows the horizontal axis and nothing else. So the effect that looks on the interface is realized.

code

//view1 view1.axis(' horizontal axis name ', false); //view2 view2.axis(' horizontal axis name ', false); Let view3 = chart.view(); let view3 = chart.view(); view3.source(temp, { //... }}); View3. axis(' horizontal axis name ', true); View3. axis(' vertical axis name ', false); view3.tooltip(false); // Tooptip does not display view3.line().position(' horizontal name * vertical name ').opacity(0).shape('smooth'); / / view3 don't showCopy the code