Skip to content

Z
zh_zcb-ems
Commit 21e9788a authored by chen.yiwen's avatar chen.yiwen
Browse files
Options

饼图改成曲线

parent b1030caf
Hide whitespace changes
Inline Side-by-side
Showing with 109 additions and 33 deletions
src/index.html
View file @ 21e9788a
...@@ -175,7 +175,7 @@ ...@@ -175,7 +175,7 @@
<li>热水</li> <li>热水</li>
</ul> </ul>
</div> </div>
<div class="echarts-content" id="pie_chart_4"></div> <div class="echarts-content" id="line_chart_4"></div>
</div> </div>
</div> </div>
......
src/js/index.js
View file @ 21e9788a
...@@ -46,36 +46,82 @@ const echart3Data = [ ...@@ -46,36 +46,82 @@ const echart3Data = [
}, },
]; ];
const echart4Data = [ // const echart4Data = [
{ // {
value: 110, // value: 110,
name: "暖通", // name: "暖通",
itemStyle: { // itemStyle: {
color: "#4380f0", // color: "#4380f0",
}, // },
}, // },
{ // {
value: 888, // value: 888,
name: "照明", // name: "照明",
itemStyle: { // itemStyle: {
color: "#01faf2", // color: "#01faf2",
}, // },
}, // },
{ // {
value: 222, // value: 222,
name: "电梯", // name: "电梯",
itemStyle: { // itemStyle: {
color: "#eef043", // color: "#eef043",
}, // },
}, // },
{ // {
value: 333, // value: 333,
name: "热水", // name: "热水",
itemStyle: { // itemStyle: {
color: "#c596ff", // color: "#c596ff",
}, // },
}, // },
]; // ];
const echart4Data = {
date: [
"0",
"1",
"2",
"3",
"4",
"5",
"6",
"7",
"8",
"9",
"10",
"11",
"12",
"13",
"14",
"15",
"16",
"17",
"18",
"19",
"20",
"21",
"22",
"23",
"24",
],
line1: [
100, 190, 250, 100, 90, 100, 250, 100, 190, 250, 100, 90, 100, 250, 100,
190, 250, 100, 90, 100, 250, 100, 190, 250, 100, 90, 100,
],
line2: [
200, 90, 200, 100, 90, 100, 200, 190, 250, 100, 90, 100, 250, 100, 190, 250,
100, 90, 100, 250, 100, 1000, 100, 250, 500,
],
line3: [
300, 90, 200, 100, 90, 100, 200, 190, 250, 100, 90, 100, 250, 100, 190, 250,
100, 90, 100, 250, 100, 1000, 100, 250, 400,
],
line4: [
400, 90, 200, 100, 90, 100, 200, 190, 250, 100, 90, 100, 250, 100, 190, 250,
100, 90, 100, 250, 100, 1000, 100, 250, 300,
],
};
const echart5Data = { const echart5Data = {
date: [ date: [
...@@ -509,8 +555,38 @@ const leftLineChart = () => { ...@@ -509,8 +555,38 @@ const leftLineChart = () => {
}; };
const rightLineChart = () => { const rightLineChart = () => {
const pieChart4 = echarts.init(document.getElementById("pie_chart_4")); // const pieChart4 = echarts.init(document.getElementById("pie_chart_4"));
pieChart4.setOption(pieChartOption(echart4Data, false, " kW")); // pieChart4.setOption(pieChartOption(echart4Data, false, " kW"));
const lineChart4 = echarts.init(document.getElementById("line_chart_4"));
lineChart4.setOption(
lineChartOption(
echart4Data.date,
[
{
data: echart4Data.line1,
color: "#4380f0",
areaColor: ["rgba(23,71,153, 1)", "rgba(23,71,153, 0)"],
},
{
data: echart4Data.line2,
color: "#01faf2",
areaColor: ["rgba(23,71,153, 1)", "rgba(23,71,153, 0)"],
},
{
data: echart4Data.line3,
color: "#eef043",
areaColor: ["rgba(23,71,153, 1)", "rgba(23,71,153, 0)"],
},
{
data: echart4Data.line4,
color: "#c596ff",
areaColor: ["rgba(23,71,153, 1)", "rgba(23,71,153, 0)"],
},
],
3
)
);
const lineChart5 = echarts.init(document.getElementById("line_chart_5")); const lineChart5 = echarts.init(document.getElementById("line_chart_5"));
lineChart5.setOption( lineChart5.setOption(
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment