如何获取echarts点击点的X轴和Y轴值

Posted 2023-04-06

1
2
3
4
5
6
7
8
9
10
11
12
13
14

1 首先，在Java Web项目中新建一个JSP页面someChart.jsp，引入echarts核心JS // 路径配置 require.config( paths: echarts: "/scripts/echarts/build/dist" );
2 由于这里要用到折线图，需要将折线图的JS引入 require( [ \'echarts\', \'echa
@echo off
set rar="C:\\Program Files\\WinRAR\\rar.exe"
setlocal enabledelayedexpansion
for /f "delims=" %%a in (\'dir /ad/b\') do (
set /a n=%%~a%%2
if !n! equ 0 (
%rar% a -hp12345678 test2 "%%~a"
) else (
%rar% a -hp12345678 test1 "%%~a"
)
)
pause 参考技术A pencilAllin简 khbyurrb

如何使用plotly js在y轴上为单个x轴值（可能是日期）绘制两个点

【中文标题】如何使用plotly js在y轴上为单个x轴值（可能是日期）绘制两个点

【英文标题】：how to plot two points on y axis for single x axis value (Maybe date) using plotly js

【发布时间】：2021-10-12 01:54:05

【问题描述】：

我有如下所示的数据集。对于每个日期，我都会在 y 轴上绘制一个或多个点。

x axis (y axis) - 2021-07-01 (20, 30)
x axis (y axis) - 2021-07-02 (20)
x axis (y axis) - 2021-07-04 (10, 50)
x axis (y axis) - 2021-07-06 (40)

如何使用 Plotly js 绘制这些数据

【问题讨论】：

您能否为您的问题添加更多信息？变量是什么样的？你想要散点图吗？

是的。我需要这样plotly.com/javascript/line-charts 但应该能够为单个 x 值绘制 2 个点（在我的情况下，同一日期想要在 y 中绘制超过 1 个点）

【参考方案1】：

我从代码笔得到了答案。 我认为这对其他人也可能有用。 如果每个 x 值有两个 y 值，我们可以复制 x 值以匹配 y 值，如下所示。

var data = [
  
    x: ['2013-10-04', '2013-10-04', '2014-11-04'],
    y: [1, 3, 6],
    type: 'scatter'
  
];

Plotly.newPlot('myDiv', data);

【讨论】：

这不考虑每个 x 值的多个 y 值。我发布了解决该问题的答案

【参考方案2】：

如果每个 x 值都有一个或多个 y 值（例如以二维数组的形式），则可以循环遍历该数组以展平它，并从原始 x 重复必要的 x 值-值数组。代码笔是here。

var x = ["2021-07-01","2021-07-02","2021-07-04","2021-07-06"]
var y = [[20, 30],[20],[10,50],[40]]
var x_plot = []
var y_plot = []

for (let i=0; i<y.length; i++) 
  for (let j=0; j<y[i].length; j++) 
    x_plot.push(x[i])
    y_plot.push(y[i][j])
  

  
var trace1 = 
  x: x_plot,
  y: y_plot,
  type: 'scatter',
  mode: 'markers'


var data = [trace1];
Plotly.newPlot('myDiv', data);