暂时提交
parent
9f0318bd9e
commit
5d4d8312d0
|
|
@ -3,8 +3,12 @@
|
||||||
<qiun-data-charts
|
<qiun-data-charts
|
||||||
type="line"
|
type="line"
|
||||||
:opts="opts"
|
:opts="opts"
|
||||||
|
background="#fff"
|
||||||
:chartData="chartData"
|
:chartData="chartData"
|
||||||
|
:canvas2d="true"
|
||||||
|
canvasId="nMPkeQGNEosMwoWKKNRBZBIEhguMoMWp"
|
||||||
:ontouch="true"
|
:ontouch="true"
|
||||||
|
:onmovetip="true"
|
||||||
/>
|
/>
|
||||||
</view>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
|
|
@ -16,66 +20,6 @@ export default {
|
||||||
chartData: {},
|
chartData: {},
|
||||||
//这里的 opts 是图表类型 type="line" 的全部配置参数，您可以将此配置复制到 config-ucharts.js 文件中下标为 ['line'] 的节点中来覆盖全局默认参数。实际应用过程中 opts 只需传入与全局默认参数中不一致的【某一个属性】即可实现同类型的图表显示不同的样式，达到页面简洁的需求。
|
//这里的 opts 是图表类型 type="line" 的全部配置参数，您可以将此配置复制到 config-ucharts.js 文件中下标为 ['line'] 的节点中来覆盖全局默认参数。实际应用过程中 opts 只需传入与全局默认参数中不一致的【某一个属性】即可实现同类型的图表显示不同的样式，达到页面简洁的需求。
|
||||||
opts: {
|
opts: {
|
||||||
timing: "easeOut",
|
|
||||||
duration: 2000,
|
|
||||||
rotate: false,
|
|
||||||
rotateLock: false,
|
|
||||||
color: ["#1890FF","#91CB74","#FAC858","#EE6666","#73C0DE","#3CA272","#FC8452","#9A60B4","#ea7ccc"],
|
|
||||||
padding: [15,10,0,15],
|
|
||||||
fontSize: 13,
|
|
||||||
fontColor: "#666666",
|
|
||||||
dataLabel: false,
|
|
||||||
dataPointShape: false,
|
|
||||||
dataPointShapeType: "solid",
|
|
||||||
touchMoveLimit: 60,
|
|
||||||
enableScroll: true,
|
|
||||||
enableMarkLine: false,
|
|
||||||
legend: {
|
|
||||||
show: true,
|
|
||||||
position: "top",
|
|
||||||
float: "center",
|
|
||||||
padding: 5,
|
|
||||||
margin: 5,
|
|
||||||
backgroundColor: "rgba(0,0,0,0)",
|
|
||||||
borderColor: "rgba(0,0,0,0)",
|
|
||||||
borderWidth: 0,
|
|
||||||
fontSize: 13,
|
|
||||||
fontColor: "#666666",
|
|
||||||
lineHeight: 11,
|
|
||||||
hiddenColor: "#CECECE",
|
|
||||||
itemGap: 10
|
|
||||||
},
|
|
||||||
xAxis: {
|
|
||||||
disableGrid: true,
|
|
||||||
disabled: false,
|
|
||||||
axisLine: true,
|
|
||||||
axisLineColor: "#CCCCCC",
|
|
||||||
calibration: true,
|
|
||||||
fontColor: "#666666",
|
|
||||||
fontSize: 13,
|
|
||||||
lineHeight: 20,
|
|
||||||
marginTop: 5,
|
|
||||||
rotateLabel: true,
|
|
||||||
rotateAngle: 45,
|
|
||||||
labelCount: 20,
|
|
||||||
itemCount: 300,
|
|
||||||
boundaryGap: "center",
|
|
||||||
splitNumber: 5,
|
|
||||||
gridColor: "#CCCCCC",
|
|
||||||
gridType: "solid",
|
|
||||||
dashLength: 4,
|
|
||||||
gridEval: 1,
|
|
||||||
scrollShow: true,
|
|
||||||
scrollAlign: "left",
|
|
||||||
scrollColor: "#A6A6A6",
|
|
||||||
scrollBackgroundColor: "#EFEBEF",
|
|
||||||
title: "时间",
|
|
||||||
titleFontSize: 13,
|
|
||||||
titleOffsetY: 0,
|
|
||||||
titleOffsetX: 10,
|
|
||||||
titleFontColor: "#666666",
|
|
||||||
format: ""
|
|
||||||
},
|
|
||||||
yAxis: {
|
yAxis: {
|
||||||
gridType: "dash",
|
gridType: "dash",
|
||||||
dashLength: 2,
|
dashLength: 2,
|
||||||
|
|
@ -130,63 +74,7 @@ export default {
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
extra: {
|
|
||||||
line: {
|
|
||||||
type: "straight",
|
|
||||||
width: 2,
|
|
||||||
activeType: "hollow",
|
|
||||||
linearType: "none",
|
|
||||||
onShadow: false,
|
|
||||||
animation: "vertical"
|
|
||||||
},
|
|
||||||
tooltip: {
|
|
||||||
showBox: true,
|
|
||||||
showArrow: true,
|
|
||||||
showCategory: false,
|
|
||||||
borderWidth: 0,
|
|
||||||
borderRadius: 0,
|
|
||||||
borderColor: "#000000",
|
|
||||||
borderOpacity: 0.7,
|
|
||||||
bgColor: "#000000",
|
|
||||||
bgOpacity: 0.7,
|
|
||||||
gridType: "solid",
|
|
||||||
dashLength: 4,
|
|
||||||
gridColor: "#CCCCCC",
|
|
||||||
boxPadding: 3,
|
|
||||||
fontSize: 13,
|
|
||||||
lineHeight: 20,
|
|
||||||
fontColor: "#FFFFFF",
|
|
||||||
legendShow: true,
|
|
||||||
legendShape: "auto",
|
|
||||||
splitLine: true,
|
|
||||||
horizentalLine: false,
|
|
||||||
xAxisLabel: false,
|
|
||||||
yAxisLabel: false,
|
|
||||||
labelBgColor: "#FFFFFF",
|
|
||||||
labelBgOpacity: 0.7,
|
|
||||||
labelFontColor: "#666666"
|
|
||||||
},
|
|
||||||
markLine: {
|
|
||||||
type: "solid",
|
|
||||||
dashLength: 4,
|
|
||||||
data: [
|
|
||||||
{
|
|
||||||
value: 0,
|
|
||||||
lineColor: "#DE4A42",
|
|
||||||
showLabel: false,
|
|
||||||
labelAlign: "left",
|
|
||||||
labelOffsetX: 0,
|
|
||||||
labelOffsetY: 0,
|
|
||||||
labelPadding: 6,
|
|
||||||
labelText: "",
|
|
||||||
labelFontSize: 13,
|
|
||||||
labelFontColor: "#666666",
|
|
||||||
labelBgColor: "#DFE8FF",
|
|
||||||
labelBgOpacity: 0.8
|
|
||||||
}
|
|
||||||
]
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
|
|
|
||||||
|
|
@ -237,23 +237,122 @@ const cfu = {
|
||||||
},
|
},
|
||||||
"line":{
|
"line":{
|
||||||
"type": "line",
|
"type": "line",
|
||||||
"color": color,
|
timing: "easeOut",
|
||||||
"padding": [15,10,0,15],
|
duration: 2000,
|
||||||
"xAxis": {
|
rotate: false,
|
||||||
"disableGrid": true,
|
rotateLock: false,
|
||||||
|
color: ["#1890FF","#91CB74","#FAC858","#EE6666","#73C0DE","#3CA272","#FC8452","#9A60B4","#ea7ccc"],
|
||||||
|
padding: [15,10,0,15],
|
||||||
|
fontSize: 13,
|
||||||
|
fontColor: "#666666",
|
||||||
|
dataLabel: false,
|
||||||
|
dataPointShape: false,
|
||||||
|
dataPointShapeType: "solid",
|
||||||
|
touchMoveLimit: 60,
|
||||||
|
enableScroll: false,
|
||||||
|
enableMarkLine: false,
|
||||||
|
xAxis: {
|
||||||
|
disableGrid: true,
|
||||||
|
disabled: false,
|
||||||
|
axisLine: true,
|
||||||
|
axisLineColor: "#CCCCCC",
|
||||||
|
calibration: true,
|
||||||
|
fontColor: "#666666",
|
||||||
|
fontSize: 13,
|
||||||
|
lineHeight: 20,
|
||||||
|
marginTop: 10,
|
||||||
|
rotateLabel: true,
|
||||||
|
rotateAngle: 45,
|
||||||
|
labelCount: 15,
|
||||||
|
itemCount: 300,
|
||||||
|
boundaryGap: "center",
|
||||||
|
splitNumber: 5,
|
||||||
|
gridColor: "#CCCCCC",
|
||||||
|
gridType: "solid",
|
||||||
|
dashLength: 4,
|
||||||
|
gridEval: 1,
|
||||||
|
scrollShow: true,
|
||||||
|
scrollAlign: "left",
|
||||||
|
scrollColor: "#A6A6A6",
|
||||||
|
scrollBackgroundColor: "#EFEBEF",
|
||||||
|
title: "时间",
|
||||||
|
titleFontSize: 13,
|
||||||
|
titleOffsetY: 0,
|
||||||
|
titleOffsetX: 10,
|
||||||
|
titleFontColor: "#666666",
|
||||||
|
format: ""
|
||||||
},
|
},
|
||||||
"yAxis": {
|
legend: {
|
||||||
"gridType": "dash",
|
show: true,
|
||||||
"dashLength": 2,
|
position: "top",
|
||||||
|
float: "center",
|
||||||
|
padding: 5,
|
||||||
|
margin: 5,
|
||||||
|
backgroundColor: "rgba(0,0,0,0)",
|
||||||
|
borderColor: "rgba(0,0,0,0)",
|
||||||
|
borderWidth: 0,
|
||||||
|
fontSize: 13,
|
||||||
|
fontColor: "#666666",
|
||||||
|
lineHeight: 11,
|
||||||
|
hiddenColor: "#CECECE",
|
||||||
|
itemGap: 10
|
||||||
},
|
},
|
||||||
"legend": {
|
extra: {
|
||||||
|
line: {
|
||||||
|
type: "straight",
|
||||||
|
width: 2,
|
||||||
|
activeType: "hollow",
|
||||||
|
linearType: "none",
|
||||||
|
onShadow: false,
|
||||||
|
animation: "vertical"
|
||||||
},
|
},
|
||||||
"extra": {
|
tooltip: {
|
||||||
"line": {
|
showBox: true,
|
||||||
"type": "straight",
|
showArrow: true,
|
||||||
"width": 2,
|
showCategory: false,
|
||||||
"activeType": "hollow"
|
borderWidth: 0,
|
||||||
|
borderRadius: 0,
|
||||||
|
borderColor: "#000000",
|
||||||
|
borderOpacity: 0.7,
|
||||||
|
bgColor: "#000000",
|
||||||
|
bgOpacity: 0.7,
|
||||||
|
gridType: "solid",
|
||||||
|
dashLength: 4,
|
||||||
|
gridColor: "#CCCCCC",
|
||||||
|
boxPadding: 3,
|
||||||
|
fontSize: 13,
|
||||||
|
lineHeight: 20,
|
||||||
|
fontColor: "#FFFFFF",
|
||||||
|
legendShow: true,
|
||||||
|
legendShape: "auto",
|
||||||
|
splitLine: true,
|
||||||
|
horizentalLine: false,
|
||||||
|
xAxisLabel: false,
|
||||||
|
yAxisLabel: false,
|
||||||
|
labelBgColor: "#FFFFFF",
|
||||||
|
labelBgOpacity: 0.7,
|
||||||
|
labelFontColor: "#666666"
|
||||||
},
|
},
|
||||||
|
markLine: {
|
||||||
|
type: "solid",
|
||||||
|
dashLength: 4,
|
||||||
|
data: [
|
||||||
|
{
|
||||||
|
value: 0,
|
||||||
|
lineColor: "#DE4A42",
|
||||||
|
showLabel: false,
|
||||||
|
labelAlign: "left",
|
||||||
|
labelOffsetX: 0,
|
||||||
|
labelOffsetY: 0,
|
||||||
|
labelPadding: 6,
|
||||||
|
labelText: "",
|
||||||
|
labelFontSize: 13,
|
||||||
|
labelFontColor: "#666666",
|
||||||
|
labelBgColor: "#DFE8FF",
|
||||||
|
labelBgOpacity: 0.8
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"tline":{
|
"tline":{
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue