Echarts的dataset设置dimensions别名

最新推荐文章于 2024-05-15 14:50:17 发布

原创最新推荐文章于 2024-05-15 14:50:17 发布

· 940 阅读

0 ·

版权

文章标签：

#数学建模

该段代码定义了一个ECharts配置，用于展示不同时间段内课时观看的时长分布，包括0-30秒、30秒-1分钟、1-3分钟、3-5分钟和5分钟以上的观看情况。数据以线图形式展示，X轴表示日期，Y轴表示时长或成本，提供了详细的图例和提示信息。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

var option = {
        title: {
          text: '课时观看时长分布',
          subtext: '数据仅供参考',
          left: 'center',
        },
        tooltip: {
          trigger: 'axis',
          axisPointer: {
            type: 'shadow',
          },
          // formatter: '{b}<br/>{a0}: {c0}人 ({d0}%)<br/>{a1}: {c1}秒 ({d1}%)',
        },
        legend: {
          data: ['0-30秒', '30秒-1分钟', '1-3分钟', '3-5分钟', '5分钟以上'],
          top: 'bottom',
        },
        dataset: {
          dimensions: [
            { name: 'ds', displayName: '日期' },
            { name: 'pv', displayName: '销售额' },
            { name: 'uv', displayName: '成本' },
          ],
          source: {
            ds: [1, 2, 3, 4, 5, 6, 7],
            pv: [30, 40, 35, 50, 45, 30, 25],
            uv: [40, 20, 30, 5, 20, 35, 40],
          },
        },
        xAxis: {
          type: 'category',
          axisLabel: {
            interval: 0,
            rotate: 30,
          },
        },
        yAxis: {
          type: 'value',
        },
        series: [
          {
            type: 'line',
          },
          {
            type: 'line',
          },
        ],
      };
      myChart.setOption(option);