ECharts 树状图实现节点点击展开，字点击事件

您好，针对您的问题，我可以给您提供一些思路和代码示例。

首先，ECharts 树状图节点的点击事件可以通过 `series` 中的 `emphasis` 属性来实现。具体来说，您可以在 `emphasis` 中设置 `focus` 属性为 `true`，并定义相应的样式，如下所示：

option = {
  series: {
    type: 'tree',
    data: [...],
    emphasis: {
      focus: 'descendant',
      itemStyle: {
        // 设置选中节点的样式
      }
    }
  }
}

上述代码中，`focus` 属性的值为 `'descendant'`，表示选中节点及其所有后代节点都会触发该事件。如果您只想选中当前节点，可以将 `focus` 的值设置为 `'self'`。

接下来，针对节点的字点击事件，您可以通过 `formatter` 属性来自定义节点的文本内容，并在其中嵌入 `<span>` 标签和相应的事件处理函数。例如，您可以将节点的文本内容设置为：

{
  name: '节点名称',
  children: [...],
  label: {
    formatter: function (params) {
      return '<span onclick="handleClick()">' + params.name + '</span>';
    }
  }
}

上述代码中，`formatter` 函数返回的文本内容中包含了一个 `<span>` 标签，并在其中绑定了一个名为 `handleClick` 的点击事件处理函数。您可以根据实际需求修改事件处理函数的名称和实现。

最后，完整的代码示例如下所示：

option = {
  series: {
    type: 'tree',
    data: [
      {
        name: '节点1',
        children: [
          {
            name: '子节点1',
            children: []
          }
        ],
        label: {
          formatter: function (params) {
            return '<span onclick="handleClick()">' + params.name + '</span>';
          }
        }
      },
      {
        name: '节点2',
        children: [
          {
            name: '子节点2',
            children: []
          }
        ],
        label: {
          formatter: function (params) {
            return '<span onclick="handleClick()">' + params.name + '</span>';
          }
        }
      }
    ],
    emphasis: {
      focus: 'descendant',
      itemStyle: {
        // 设置选中节点的样式
      }
    }
  }
}

function handleClick() {
  // 处理点击事件的逻辑
}

希望以上内容能够帮助到您，如有任何疑问或问题，请随时向我提出。