在 ECharts 中,象形柱图(Pictorial Bar)是一种以图形代替简单的柱子,以更形象生动地展示数据的图表类型。以下是一个简单的象形柱图的例子:
option = {
    xAxis: {
        type: 'category',
        data: ['Category A', 'Category B', 'Category C', 'Category D']
    },
    yAxis: {
        type: 'value'
    },
    series: [{
        type: 'pictorialBar',  // 象形柱图
        symbol: 'rect',        // 图形的形状,可以是 'rect'、'circle'、'diamond' 等
        itemStyle: {
            color: 'skyblue'   // 图形的颜色
        },
        symbolSize: 40,         // 图形的大小
        data: [100, 80, 120, 150],  // 数据
        symbolRepeat: 'fixed',  // 图形的重复方式,'fixed' 表示按照数据的数量重复
        symbolMargin: '50%',    // 图形间的间隔
        z: 3  // 图形的层级,可以控制图形的显示顺序
    }]
};

// 使用刚指定的配置项和数据显示图表。
myChart.setOption(option);

在上述代码中,type: 'pictorialBar' 表示这是一个象形柱图。通过设置 symbol 来指定图形的形状,可以是 'rect'(矩形)、'circle'(圆形)、'diamond'(菱形)等。itemStyle 用于设置图形的样式,这里设置了颜色为 'skyblue'。

symbolSize 控制图形的大小,data 数组包含了每个象形柱图对应的数据。

symbolRepeat 控制图形的重复方式,可以是 'fixed'(按照数据的数量重复)或 'repeat'(在坐标轴上均匀重复)。symbolMargin 控制图形间的间隔。

z 属性用于控制图形的层级,数字越大,图形显示在越上层。

以上是一个简单的例子,你可以根据实际需求调整各种属性来满足你的图表设计。


转载请注明出处:http://www.zyzy.cn/article/detail/5445/ECharts