In this demo I'm trying to make the title red and create a shadow blur, however the settings are not having any effect.
var dom = document.getElementById("chart-container");
var myChart = echarts.init(dom, null, {
renderer: "canvas",
useDirtyRect: false
});
var app = {};
var option;
option = {
title: {
color: "red",
show: true,
shadowBlur: 5,
shadowColor: "red",
shadowOffsetX: 25,
shadowOffsetY: 25,
text: "Main Title",
subtext: "Sub Title",
left: "left",
top: "center",
textStyle: {
fontSize: 30
},
subtextStyle: {
fontSize: 20
}
}
};
Any ideas?
The color of the title text has to be set under textStyle
; the same goes for subtitle and subtextStyle
.
The shadow doesn't show because the background color is by default 'transparent'
; you may set it to the chart's background color,
white, to activate.
So the option should be something on the lines of
option = {
title: {
//show: true, // default
backgroundColor: "white",
shadowBlur: 5,
shadowColor: "red",
shadowOffsetX: 25,
shadowOffsetY: 25,
text: "Main Title",
subtext: "Sub Title",
left: "left",
top: "center",
textStyle: {
color: "red",
fontSize: 40
},
subtextStyle: {
fontSize: 20
}
}
};