Echarts 折线图双 Y 轴共用一个网格：详细教程和示例代码

"Echarts 折线图双 Y 轴共用一个网格：详细教程和示例代码"\n\n要在 Echarts 中创建一个折线图，并使用双 y 轴，需要设置yAxisIndex属性来指定每个系列使用的 y 轴索引。然后，通过grid属性来设置图表的网格。\n\n下面是一个示例代码：\n\njavascript\n// 初始化 Echarts 实例\nvar myChart = echarts.init(document.getElementById('chart'));\n\n// 配置图表\nvar option = {\n grid: {\n top: 50,\n bottom: 80,\n left: 50,\n right: 50\n },\n xAxis: {\n type: 'category',\n data: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun'],\n },\n yAxis: [\n {\n type: 'value',\n name: 'y1',\n position: 'left',\n },\n {\n type: 'value',\n name: 'y2',\n position: 'right',\n }\n ],\n series: [\n {\n name: 'Series 1',\n type: 'line',\n data: [10, 20, 30, 40, 50, 60],\n yAxisIndex: 0 // 使用第一个 y 轴\n },\n {\n name: 'Series 2',\n type: 'line',\n data: [100, 200, 300, 400, 500, 600],\n yAxisIndex: 1 // 使用第二个 y 轴\n }\n ]\n};\n\n// 渲染图表\nmyChart.setOption(option);\n\n\n在上面的代码中，通过yAxis数组定义了两个 y 轴，分别指定了它们的位置和名称。然后，在每个系列的配置中，使用yAxisIndex属性指定该系列使用的 y 轴索引。\n\n通过grid属性可以设置图表的网格，包括顶部、底部、左侧和右侧的边距。你可以根据需要调整这些数值以满足你的需求。\n\n