var pathSymbols = {
one: 'path://M120.47220411 438.99721984H62.60742355v-28.66366908h173.95263709v28.66366908h-57.86478054v174.49008096H120.47220411v-174.49008096zM297.82865286 585.00278016h-28.66366907v-145.82641335h28.66366907v-28.66366761h145.82641336v28.66366761h28.66366759v145.82641335h-28.66366759v28.66366908h-145.82641336v-28.66366908z m29.73855535-145.46811645v144.75152561H414.09565783v-144.75152561h-86.52844962zM518.53889918 410.5126992h145.28896948v28.66366761h28.66366908v87.42418892h-28.66366908v29.20111295h-87.42418893v57.86478056h-57.86478055V410.5126992z m58.40222441 29.02196451v86.52844816h57.32733671v-86.52844816h-57.32733671zM845.66301535 585.00278016h28.12622518v-116.62530042h-28.12622518v-29.20111293h28.66366908v-28.66366761h58.4022244v174.49008096h28.66366762v28.66366908H845.84216378v-28.66366908z',
two: 'path://M120.47220411 438.99721984H62.60742355v-28.66366908h173.95263709v28.66366908h-57.86478054v174.49008096H120.47220411v-174.49008096zM297.82865286 585.00278016h-28.66366907v-145.82641335h28.66366907v-28.66366761h145.82641336v28.66366761h28.66366759v145.82641335h-28.66366759v28.66366908h-145.82641336v-28.66366908z m29.73855535-145.46811645v144.75152561H414.09565783v-144.75152561h-86.52844962zM518.53889918 410.5126992h145.28896948v28.66366761h28.66366908v87.42418892h-28.66366908v29.20111295h-87.42418893v57.86478056h-57.86478055V410.5126992z m58.40222441 29.02196451v86.52844816h57.32733671v-86.52844816h-57.32733671zM816.46190239 526.60055573h28.66366907v-29.20111146h57.86478055v-58.40222443h-86.52844962v-28.66366908h116.08785798v28.66366908h28.66366763v58.40222443h-28.66366763v29.20111146h-57.86478054v58.40222443h86.52844817v28.66366908h-144.75152561v-87.06589351z',
three: 'path://M45.056 368.128l157.696 0.512c19.456 0.512 29.184 10.24 29.184 30.208 0 20.992-10.24 31.744-31.232 32.256h-46.592v155.648c0 20.48-10.752 30.72-31.232 30.72-20.992 0-31.232-10.24-31.232-30.208V431.104H45.056c-20.992 0-31.232-10.24-31.232-31.232 0.512-20.48 10.752-31.232 31.232-31.744zM387.072 368.64c20.992 0 41.472 5.12 61.44 15.872s35.328 26.112 46.592 46.08c11.264 19.968 16.896 40.96 16.896 62.464 0 21.504-5.632 41.984-16.384 61.952-10.752 19.968-26.112 35.328-46.08 46.08-19.968 10.752-40.448 16.384-62.464 16.384-21.504 0-41.984-5.632-61.952-16.384-19.968-10.752-35.328-26.112-46.08-46.08-10.752-19.968-16.384-40.448-16.384-61.952 0-21.504 5.632-42.496 16.896-62.464 11.264-19.968 26.624-35.328 46.592-46.08 19.456-10.24 39.936-15.872 60.928-15.872z m-30.208 70.144c-9.728 5.12-17.408 12.8-23.04 23.04s-8.192 20.48-8.192 31.232c0 10.752 2.56 20.992 8.192 30.72 5.632 9.728 13.312 17.408 23.04 23.04s20.48 8.192 31.232 8.192c10.752 0 20.992-2.56 31.232-8.192 9.728-5.632 17.408-13.312 23.04-23.04s8.192-19.968 8.192-30.72-2.56-21.504-8.192-31.232c-5.632-10.24-13.312-17.92-23.552-23.04-9.728-5.12-19.968-8.192-30.72-8.192-11.264 0-21.504 2.56-31.232 8.192zM574.464 368.64h109.056c19.968 0 37.888 7.68 53.76 23.04 15.872 15.36 23.552 33.28 23.552 54.272 0 21.504-7.68 39.936-23.04 55.296-15.36 15.36-33.792 23.04-55.296 23.04l-30.72 0.512c-20.48 0-30.72-10.24-30.72-31.232s10.24-31.232 31.232-31.232h22.016c16.384 0 24.576-4.608 24.064-14.848 0-10.24-8.192-15.36-24.576-15.36h-68.608v155.136c0 20.992-10.24 31.232-31.232 31.232s-31.232-10.24-31.232-30.72V399.36c0.512-19.968 10.752-30.72 31.744-30.72zM823.296 368.64H931.84c20.48 0 38.912 7.68 54.272 23.552 15.872 15.36 23.552 33.792 23.04 54.272 0 20.992-5.632 36.352-16.384 46.08 10.752 10.752 16.384 26.624 16.384 47.104 0 20.48-8.192 38.4-23.552 54.272-15.36 15.872-33.28 23.552-52.224 23.552h-111.104c-20.48 0-30.72-10.24-30.72-31.232 0-20.48 10.24-30.72 31.232-30.72l108.544-0.512c10.24 0 15.872-5.12 15.872-15.36s-5.12-15.872-15.36-15.872h-47.104c-20.992 0-31.232-10.752-31.232-32.768 0-19.456 10.24-29.184 31.232-29.184h47.104c10.24 0 15.36-5.632 14.848-16.896 0.512-9.216-4.608-13.824-14.848-13.824h-109.056c-20.992 0-31.232-10.24-31.232-31.232 0.512-20.48 10.752-31.232 31.744-31.232z',
four: 'path://M921.6 38.4v128c0 12.8-12.8 25.6-25.6 25.6H601.6v806.4c0 12.8 0 25.6-25.6 25.6H435.2c-12.8 0-25.6-12.8-25.6-25.6V192H128c-12.8 0-25.6-12.8-25.6-25.6v-128C102.4 25.6 115.2 12.8 128 12.8h768c12.8 0 25.6 12.8 25.6 25.6zM1638.4 1024H1177.6c-89.6 0-179.2-89.6-179.2-179.2V179.2C998.4 89.6 1088 0 1177.6 0h460.8c102.4 0 179.2 89.6 179.2 179.2v665.6c0 89.6-89.6 179.2-179.2 179.2z m-64-844.8H1241.6c-25.6 0-38.4 25.6-38.4 38.4v576c0 25.6 25.6 38.4 38.4 38.4h332.8c25.6 0 38.4-25.6 38.4-38.4V217.6c0-12.8-12.8-38.4-38.4-38.4z m384-166.4H2688c12.8 0 25.6 12.8 25.6 25.6V640c0 12.8-12.8 25.6-25.6 25.6h-550.4v332.8c0 12.8-12.8 25.6-25.6 25.6h-140.8c-12.8 0-25.6-12.8-25.6-25.6V38.4c-12.8-25.6-12.8-25.6 12.8-25.6z m550.4 473.6V204.8h-384v281.6h384z m1241.6 102.4v128c0 12.8-12.8 25.6-25.6 25.6h-76.8v230.4c0 12.8-12.8 25.6-25.6 25.6h-140.8c-12.8 0-25.6-12.8-25.6-25.6V742.4h-384c-12.8 0-25.6-12.8-25.6-25.6l64-652.8c0-12.8 12.8-25.6 25.6-25.6h128c12.8 0 25.6 12.8 25.6 25.6l-51.2 499.2H3456v-512c0-12.8 12.8-25.6 25.6-25.6h140.8c12.8 0 25.6 12.8 25.6 25.6v524.8h76.8c12.8-12.8 25.6 0 25.6 12.8z',
five: 'path://M2240 64v121.6h-262.4v236.8c12.8-12.8 25.6-19.2 44.8-32 19.2-6.4 38.4-12.8 64-12.8 44.8 0 83.2 12.8 108.8 38.4 25.6 25.6 44.8 64 44.8 115.2V768c0 32-6.4 57.6-19.2 76.8-12.8 25.6-25.6 44.8-44.8 57.6-19.2 19.2-38.4 32-64 38.4s-51.2 12.8-76.8 12.8-51.2-6.4-76.8-12.8c-25.6-6.4-44.8-19.2-64-38.4s-32-38.4-44.8-57.6c-12.8-25.6-19.2-51.2-19.2-76.8v-38.4h134.4v38.4c0 19.2 6.4 38.4 19.2 51.2 12.8 12.8 25.6 19.2 51.2 19.2 19.2 0 32-6.4 44.8-19.2 12.8-12.8 19.2-25.6 19.2-51.2V569.6c0-19.2-6.4-32-19.2-44.8-12.8-12.8-25.6-19.2-44.8-19.2-12.8 0-19.2 0-25.6 6.4-6.4 6.4-12.8 0-19.2 6.4-6.4 6.4-6.4 12.8-12.8 25.6-6.4 6.4-6.4 12.8-6.4 12.8H1856V64h384zM1228.8 185.6v300.8h64c25.6 0 44.8-6.4 64-12.8 12.8-6.4 25.6-19.2 32-32 6.4-12.8 12.8-25.6 12.8-44.8v-57.6-57.6c0-19.2-6.4-32-12.8-51.2s-19.2-25.6-32-32c-12.8-12.8-32-12.8-57.6-12.8h-70.4z m-134.4 768V64h198.4c38.4 0 70.4 6.4 96 12.8 25.6 6.4 51.2 25.6 76.8 51.2 25.6 25.6 38.4 51.2 44.8 83.2s12.8 70.4 12.8 128c0 38.4 0 70.4-6.4 102.4-6.4 25.6-12.8 51.2-32 76.8-19.2 32-44.8 51.2-70.4 70.4-32 19.2-70.4 25.6-121.6 25.6h-70.4V960h-128v-6.4z m-422.4-204.8c0 32 6.4 51.2 25.6 70.4s38.4 19.2 64 19.2 44.8-6.4 64-19.2c19.2-12.8 25.6-38.4 25.6-70.4V275.2c0-32-6.4-51.2-25.6-70.4-19.2-12.8-38.4-12.8-64-12.8s-44.8 6.4-64 19.2c-19.2 12.8-25.6 38.4-25.6 70.4v467.2zM537.6 275.2c0-38.4 6.4-64 19.2-96 12.8-25.6 32-51.2 51.2-70.4s44.8-32 70.4-38.4c25.6-6.4 51.2-12.8 76.8-12.8 25.6 0 51.2 6.4 76.8 12.8s51.2 19.2 70.4 38.4 38.4 38.4 51.2 70.4c12.8 25.6 19.2 57.6 19.2 96v473.6c0 38.4-6.4 70.4-19.2 96s-32 51.2-51.2 64c-19.2 19.2-44.8 32-70.4 38.4-25.6 6.4-51.2 12.8-76.8 12.8s-51.2-6.4-76.8-12.8c-25.6-6.4-51.2-25.6-70.4-38.4-19.2-19.2-38.4-38.4-51.2-64s-19.2-57.6-19.2-96V275.2z m-320 678.4v-768H64V64h435.2v121.6H352v768H217.6z',
};
var data = [123, 60, 25, 18, 12]
var symbolData = [
{
value: data[0],
symbol: pathSymbols['one']
},
{
value: data[1],
symbol: pathSymbols['two']
},
{
value: data[2],
symbol: pathSymbols['three']
},
{
value: data[3],
symbol: pathSymbols['four']
}, {
value: data[4],
symbol: pathSymbols['five']
}]
option = {
backgroundColor: '#0b2258',
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'none'
},
formatter: function (params) {
return params[0].name + ': ' + params[0].value;
}
},
grid: {
top: '3%',
bottom: '8%',
right: '5%',
left: '15%',
},
xAxis: {
data: ['缺料', '冷隔', '拉膜', '气孔', '不白'],
axisTick: { show: false },
axisLine: { show: false },
axisLabel: {
color: 'rgba(255, 255, 255, 0.7)',
fontSize: 16
}
},
yAxis: {
splitLine: { show: false },
axisTick: { show: false },
axisLine: { show: false },
offset: 30,
axisLabel: { show: false },
},
color: ['#41C8D6'],
series: [{
name: 'hill',
type: 'pictorialBar',
barCategoryGap: '-170%',
symbolClip: true,
// symbol: 'path://M0,10 L10,10 L5,0 L0,10 z',
symbol: 'path://M0,10 L10,10 C5.5,10 5.5,5 5,0 C4.5,5 4.5,10 0,10 z',
emphasis: {
itemStyle: {
opacity: 1
}
},
itemStyle: {
color: function (params) {
if (params.dataIndex == 4) {
return {
type: 'linear',
x: 0,
y: 0,
x2: 0,
y2: 1,
colorStops: [
{
offset: 0,
color: 'rgba(82, 98, 253, 0)',
},
{
offset: 1,
color: 'rgba(82, 98, 253, 0.3)',
},
],
global: false, // 缺省为 false
}
} else if (params.dataIndex == 3) {
return {
type: 'linear',
x: 0,
y: 0,
x2: 0,
y2: 1,
colorStops: [
{
offset: 0,
color: 'rgba(80, 186, 226, 0)',
},
{
offset: 1,
color: 'rgba(80, 186, 226, 0.3)',
},
],
global: false, // 缺省为 false
}
}else if (params.dataIndex == 2) {
return {
type: 'linear',
x: 0,
y: 0,
x2: 0,
y2: 1,
colorStops: [
{
offset: 0,
color: 'rgba(77, 255, 148, 0)',
},
{
offset: 1,
color: 'rgba(77, 255, 148, 0.3)',
},
],
global: false, // 缺省为 false
}
}else if (params.dataIndex == 1) {
return {
type: 'linear',
x: 0,
y: 0,
x2: 0,
y2: 1,
colorStops: [
{
offset: 0,
color: 'rgba(255, 170, 49, 0)',
},
{
offset: 1,
color: 'rgba(255, 170, 49, 0.3)',
},
],
global: false, // 缺省为 false
}
}else {
return {
type: 'linear',
x: 0,
y: 0,
x2: 0,
y2: 1,
colorStops: [
{
offset: 0,
color: 'rgba(255, 84, 31, 0)',
},
{
offset: 1,
color: 'rgba(255, 84, 31, 0.3)',
},
],
global: false, // 缺省为 false
}
}
},
},
label: {
show: true,
position: 'top',
textStyle: {
color: '#fff',
fontSize: 16
},
formatter: function (params) {
return params.value + '个'
},
},
data,
z: 10
},
{
name: "glyph",
type: "pictorialBar",
barGap: "-98%",
//symbolPosition: "end",
symbolSize: [20, 10],
symbolOffset: ["-25%", "-30%"],
itemStyle: {
color: function (params) {
if (params.dataIndex == 4) {
return {
type: 'linear',
x: 0,
y: 0,
x2: 0,
y2: 1,
colorStops: [
{
offset: 0,
color: 'rgba(82, 98, 253, 1)',
},
{
offset: 1,
color: 'rgba(82, 98, 253, 1)',
},
],
global: false, // 缺省为 false
}
} else if (params.dataIndex == 3) {
return {
type: 'linear',
x: 0,
y: 0,
x2: 0,
y2: 1,
colorStops: [
{
offset: 0,
color: 'rgba(80, 186, 226, 1)',
},
{
offset: 1,
color: 'rgba(80, 186, 226, 1)',
},
],
global: false, // 缺省为 false
}
}else if (params.dataIndex == 2) {
return {
type: 'linear',
x: 0,
y: 0,
x2: 0,
y2: 1,
colorStops: [
{
offset: 0,
color: 'rgba(77, 255, 148, 1)',
},
{
offset: 1,
color: 'rgba(77, 255, 148, 1)',
},
],
global: false, // 缺省为 false
}
}else if (params.dataIndex == 1) {
return {
type: 'linear',
x: 0,
y: 0,
x2: 0,
y2: 1,
colorStops: [
{
offset: 0,
color: 'rgba(255, 170, 49, 1)',
},
{
offset: 1,
color: 'rgba(255, 170, 49, 1)',
},
],
global: false, // 缺省为 false
}
}else {
return {
type: 'linear',
x: 0,
y: 0,
x2: 0,
y2: 1,
colorStops: [
{
offset: 0,
color: 'rgba(255, 84, 31, 1)',
},
{
offset: 1,
color: 'rgba(255, 84, 31, 1)',
},
],
global: false, // 缺省为 false
}
}
},
},
emphasis: {
itemStyle: {
opacity: 1,
},
},
data: symbolData,
}]
};