|
|
@@ -55,6 +55,19 @@ export function useChartRender(){
|
|
|
}
|
|
|
}
|
|
|
|
|
|
+/**备注一下 越多越乱
|
|
|
+ * @params
|
|
|
+ * Source 1 ; chartType只在source:1用到 1曲线 2季节 3面积 4堆积柱 5散点 6组合 7柱形 8截面散点
|
|
|
+ * 2 商品价格
|
|
|
+ * 3 相关性
|
|
|
+ * 4 滚动相关性
|
|
|
+ * 5 商品利润
|
|
|
+ * 6 拟合方程
|
|
|
+ * 7 统计特征/标准差
|
|
|
+ * 8 统计特征/百分位
|
|
|
+ * 9 统计特征/频率
|
|
|
+ * 10 跨品种分析
|
|
|
+ */
|
|
|
export function chartRender({data,renderId,lang='zh',changeLangIsCheck,showChartTitle=true}){
|
|
|
// 初始化掉极值数据
|
|
|
axisLimitState.leftIndex=-1
|
|
|
@@ -81,26 +94,6 @@ export function chartRender({data,renderId,lang='zh',changeLangIsCheck,showChart
|
|
|
RenderDomId.value=renderId
|
|
|
chartData.value=data
|
|
|
|
|
|
- // if([1,3,4,5,6].includes(data.ChartInfo.ChartType)){
|
|
|
- // const chartSetMap = {
|
|
|
- // 1: setSplineOpt,
|
|
|
- // 3: setStackOrCombinChart,
|
|
|
- // 4: setStackOrCombinChart,
|
|
|
- // 5: setScatterOptions,
|
|
|
- // 6: setStackOrCombinChart
|
|
|
- // };
|
|
|
- // chartOpt=chartSetMap[data.ChartInfo.ChartType](data)
|
|
|
- // }else if(data.ChartInfo.ChartType ===2 ) {
|
|
|
- // chartOpt=setSeasonOpt(data)
|
|
|
- // }else if(data.ChartInfo.ChartType ===7){//奇怪柱形图依赖数据
|
|
|
- // chartOpt=initBarData(data);
|
|
|
- // }else if(data.ChartInfo.ChartType ===8){//商品价格曲线
|
|
|
- // chartOpt=initCommodityData(data);
|
|
|
- // }else if(data.ChartInfo.ChartType ===9){//相关性图
|
|
|
- // chartOpt=initRelevanceChart(data);
|
|
|
- // }else if(data.ChartInfo.ChartType ===10){//截面散点图
|
|
|
- // chartOpt=setSectionScatterChart(data);
|
|
|
- // }
|
|
|
if(data.ChartInfo.Source===1){
|
|
|
const chartSetMap = {
|
|
|
1: setSplineOpt,
|
|
|
@@ -121,6 +114,8 @@ export function chartRender({data,renderId,lang='zh',changeLangIsCheck,showChart
|
|
|
chartOpt=setSplineOpt(data);
|
|
|
}else if([9].includes(data.ChartInfo.Source)){//统计频率
|
|
|
chartOpt=setStatisticFrequency(data);
|
|
|
+ }else if(data.ChartInfo.Source===10) {
|
|
|
+ chartOpt = setCrossVarietyChart(data)
|
|
|
}
|
|
|
|
|
|
|
|
|
@@ -1809,3 +1804,115 @@ function setSectionScatterChart({DataResp}) {
|
|
|
tooltip
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
+/* 跨品种分析 */
|
|
|
+function setCrossVarietyChart({DataResp,EdbInfoList}) {
|
|
|
+ axisLimitState.leftIndex=-1
|
|
|
+ axisLimitState.rightIndex=-1
|
|
|
+ axisLimitState.rightTwoIndex=-1
|
|
|
+
|
|
|
+ const { DataList,XName,YName,XNameEn,YNameEn,XMaxValue,XMinValue,YMaxValue,YMinValue } = DataResp;
|
|
|
+
|
|
|
+ //y轴
|
|
|
+ let yAxis = {
|
|
|
+ ...basicYAxis,
|
|
|
+ title: {
|
|
|
+ text: YName,
|
|
|
+ textCh:YName,// 中文
|
|
|
+ textEn:YNameEn||YName,
|
|
|
+ align: 'middle',
|
|
|
+ },
|
|
|
+ opposite: false,
|
|
|
+ reversed: false,
|
|
|
+ min: Number(YMinValue),
|
|
|
+ max: Number(YMaxValue),
|
|
|
+ tickWidth: 1,
|
|
|
+ }
|
|
|
+
|
|
|
+ // x轴
|
|
|
+ let xAxis = {
|
|
|
+ ...scatterXAxis,
|
|
|
+ title: {
|
|
|
+ text: XName,
|
|
|
+ textCh:XName,// 中文
|
|
|
+ textEn:XNameEn || XName,
|
|
|
+ align: 'middle',
|
|
|
+ },
|
|
|
+ min: Number(XMinValue),
|
|
|
+ max: Number(XMaxValue),
|
|
|
+ }
|
|
|
+
|
|
|
+ //数据列
|
|
|
+ let series = [];
|
|
|
+ DataList.forEach(item => {
|
|
|
+ //数据列
|
|
|
+ let series_item = {
|
|
|
+ data: [],
|
|
|
+ type: 'scatter',
|
|
|
+ name: item.Name,
|
|
|
+ nameCh: item.Name,
|
|
|
+ nameEn: item.NameEn||item.Name,
|
|
|
+ color: item.Color,
|
|
|
+ lineWidth: 0,
|
|
|
+ chartType: 'linear',
|
|
|
+ zIndex:1
|
|
|
+ }
|
|
|
+ item.CoordinatePointData.forEach(_ => {
|
|
|
+ series_item.data.push({x: _.X,y: _.Y,})
|
|
|
+ })
|
|
|
+ series.push(series_item);
|
|
|
+ })
|
|
|
+
|
|
|
+ let tooltip = {
|
|
|
+ formatter: function() {
|
|
|
+ let series_obj = DataList.find(_ => _.Name === this.series.name);
|
|
|
+ let ponit_obj = series_obj.CoordinatePointData.find(_ => _.X ===this.x && _.Y===this.y);
|
|
|
+
|
|
|
+ let xEdbInfo = EdbInfoList.find(_ => _.EdbInfoId===ponit_obj.XEdbInfoId);
|
|
|
+ let yEdbInfo = EdbInfoList.find(_ => _.EdbInfoId===ponit_obj.YEdbInfoId);
|
|
|
+
|
|
|
+ let str=`<b>${ this.series.name }</b>`;
|
|
|
+ str += `<br><span style="color:${this.color}">\u25CF</span>${xEdbInfo.EdbName}: ${this.x} ${ponit_obj.XDate}<br>`;
|
|
|
+ str += `<span style="color:${this.color}">\u25CF</span>${yEdbInfo.EdbName}: ${this.y} ${ponit_obj.YDate}`;
|
|
|
+
|
|
|
+ return str
|
|
|
+ },
|
|
|
+ formatterCh: function() {
|
|
|
+ let series_obj = DataList.find(_ => _.Name === this.series.name);
|
|
|
+ let ponit_obj = series_obj.CoordinatePointData.find(_ => _.X ===this.x && _.Y===this.y);
|
|
|
+
|
|
|
+ let xEdbInfo = EdbInfoList.find(_ => _.EdbInfoId===ponit_obj.XEdbInfoId);
|
|
|
+ let yEdbInfo = EdbInfoList.find(_ => _.EdbInfoId===ponit_obj.YEdbInfoId);
|
|
|
+
|
|
|
+ let str=`<b>${ this.series.name }</b>`;
|
|
|
+ str += `<br><span style="color:${this.color}">\u25CF</span>${xEdbInfo.EdbName}: ${this.x} ${ponit_obj.XDate}<br>`;
|
|
|
+ str += `<span style="color:${this.color}">\u25CF</span>${yEdbInfo.EdbName}: ${this.y} ${ponit_obj.YDate}`;
|
|
|
+
|
|
|
+ return str
|
|
|
+
|
|
|
+ },
|
|
|
+ formatterEn: function() {
|
|
|
+ let series_obj = DataList.find(_ => _.NameEn === this.series.name);
|
|
|
+ let ponit_obj = series_obj.CoordinatePointData.find(_ => _.X ===this.x && _.Y===this.y);
|
|
|
+
|
|
|
+ let xEdbInfo = EdbInfoList.find(_ => _.EdbInfoId===ponit_obj.XEdbInfoId);
|
|
|
+ let yEdbInfo = EdbInfoList.find(_ => _.EdbInfoId===ponit_obj.YEdbInfoId);
|
|
|
+
|
|
|
+ let str=`<b>${ this.series.name }</b>`;
|
|
|
+ str += `<br><span style="color:${this.color}">\u25CF</span>${xEdbInfo.EdbNameEn}: ${this.x} ${ponit_obj.XDate}<br>`;
|
|
|
+ str += `<span style="color:${this.color}">\u25CF</span>${yEdbInfo.EdbNameEn}: ${this.y} ${ponit_obj.YDate}`;
|
|
|
+
|
|
|
+ return str
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ return {
|
|
|
+ title: {
|
|
|
+ text:''
|
|
|
+ },
|
|
|
+ series,
|
|
|
+ yAxis: [yAxis],
|
|
|
+ xAxis,
|
|
|
+ tooltip
|
|
|
+ }
|
|
|
+}
|
