jimmychai
2 years ago
9 changed files with 886 additions and 22 deletions
@ -0,0 +1,146 @@ |
|||||||
|
<?xml version="1.0" encoding="UTF-8" standalone="no"?> |
||||||
|
<project basedir="." default="jar" name="plugin"> |
||||||
|
<!-- JDK路径，根据自己机器上实际位置修改--> |
||||||
|
<!-- JDK路径，根据自己机器上实际位置修改--> |
||||||
|
<property name="jdk.home" value="D:\Java\jdk1.8.0_361"/> |
||||||
|
|
||||||
|
<property name="libs" value="${basedir}/lib"/> |
||||||
|
<property name="publicLibs" value=""/> |
||||||
|
<property name="reportLibs" value="D:\chrome\downloads\BI6.0_spider_jar_jdk1.8"/> |
||||||
|
<property name="destLoc" value="."/> |
||||||
|
<property name="classes" value="classes"/> |
||||||
|
<xmlproperty file="${basedir}/plugin.xml"/> |
||||||
|
<property name="current-version" value="${plugin.version}"/> |
||||||
|
|
||||||
|
<!-- 插件版本--> |
||||||
|
<property name="plugin-version" value="${current-version}"/> |
||||||
|
<!-- 插件名字--> |
||||||
|
<property name="plugin-name" value="bi-custom-chart-demo"/> |
||||||
|
<property name="plugin-jar" value="${plugin-name}-${plugin-version}.jar"/> |
||||||
|
<property name="compile_files" value="${basedir}/src/main/java"/> |
||||||
|
<!-- 编译好的classe--> |
||||||
|
<property name="exist_classes" value="${basedir}/target/classes"/> |
||||||
|
|
||||||
|
<target name="prepare"> |
||||||
|
<!-- <delete dir="${classes}"/>--> |
||||||
|
<delete dir="fr-plugin-${plugin-name}-${plugin-version}"/> |
||||||
|
<xmlproperty file="${basedir}/plugin.xml"/> |
||||||
|
<delete dir="${destLoc}/${plugin.name}"/> |
||||||
|
</target> |
||||||
|
<path id="compile.classpath"> |
||||||
|
<fileset dir="${libs}"> |
||||||
|
<include name="**/*.jar"/> |
||||||
|
</fileset> |
||||||
|
<fileset dir="${publicLibs}"> |
||||||
|
<include name="**/*.jar"/> |
||||||
|
</fileset> |
||||||
|
<fileset dir="${reportLibs}"> |
||||||
|
<include name="**/*.jar"/> |
||||||
|
</fileset> |
||||||
|
</path> |
||||||
|
<patternset id="resources4Jar"> |
||||||
|
<exclude name="**/.settings/**"/> |
||||||
|
<exclude name=".classpath"/> |
||||||
|
<exclude name=".project"/> |
||||||
|
|
||||||
|
<exclude name="**/*.java"/> |
||||||
|
<exclude name="**/*.db"/> |
||||||
|
<exclude name="**/*.g"/> |
||||||
|
<exclude name="**/package.html"/> |
||||||
|
</patternset> |
||||||
|
<target name="copy_resources"> |
||||||
|
<echo message="从${resources_from}拷贝图片,JS,CSS等资源文件"/> |
||||||
|
<delete dir="tmp"/> |
||||||
|
<copy todir="tmp"> |
||||||
|
<fileset dir="${resources_from}/src/main/resources"> |
||||||
|
<patternset refid="resources4Jar"/> |
||||||
|
</fileset> |
||||||
|
</copy> |
||||||
|
<copy todir="${classes}"> |
||||||
|
<fileset dir="tmp"/> |
||||||
|
</copy> |
||||||
|
<delete dir="tmp"/> |
||||||
|
</target> |
||||||
|
|
||||||
|
<path id="compile.classpath2"> |
||||||
|
<fileset dir="${basedir}/lib"> |
||||||
|
<include name="*.jar"/> |
||||||
|
</fileset> |
||||||
|
<pathelement path="H:\coding\java\fanruan\bi\bi6.0_release\env\webroot\WEB-INF\classes"/> |
||||||
|
</path> |
||||||
|
<target name="compile_javas"> |
||||||
|
<echo message="编译${compile_files}下的Java文件"/> |
||||||
|
<javac destdir="${classes}" debug="true" optimize="on" source="${source_jdk_version}" |
||||||
|
target="${target_jdk_version}" |
||||||
|
fork="true" memoryMaximumSize="1024m" listfiles="false" srcdir="${compile_files}" |
||||||
|
executable="${compile_jdk_version}/bin/javac" |
||||||
|
verbose="true"> |
||||||
|
<src path="${compile_files}"/> |
||||||
|
<exclude name="**/.svn/**"/> |
||||||
|
<compilerarg line="-encoding UTF8 "/> |
||||||
|
<classpath refid="compile.classpath2"/> |
||||||
|
<classpath refid="compile.classpath"/> |
||||||
|
</javac> |
||||||
|
<taskdef name="pretreatment" classname="com.fr.plugin.pack.PluginPretreatmentTask"> |
||||||
|
<classpath refid="compile.classpath"/> |
||||||
|
</taskdef> |
||||||
|
<pretreatment baseDir="${basedir}"/> |
||||||
|
</target> |
||||||
|
|
||||||
|
<!-- <target name="compile_javas">--> |
||||||
|
<!-- <echo message="如果无其他依赖则直接用${exist_classes}避免ant报错"/>--> |
||||||
|
<!-- </target>--> |
||||||
|
|
||||||
|
<target name="jar_classes"> |
||||||
|
<echo message="打Jar包:${jar_name}"/> |
||||||
|
<delete file="${basedir}/${jar_name}"/> |
||||||
|
<jar jarfile="${basedir}/${jar_name}"> |
||||||
|
<fileset dir="${classes}"> |
||||||
|
<exclude name="**/*.java"/> |
||||||
|
</fileset> |
||||||
|
</jar> |
||||||
|
</target> |
||||||
|
|
||||||
|
<target name="super_jar" depends="prepare"> |
||||||
|
<antcall target="copy_resources"> |
||||||
|
<param name="resources_from" value="${basedir}"/> |
||||||
|
</antcall> |
||||||
|
<antcall target="compile_javas"> |
||||||
|
<param name="source_jdk_version" value="1.8"/> |
||||||
|
<param name="target_jdk_version" value="1.8"/> |
||||||
|
<param name="compile_jdk_version" value="${jdk.home}"/> |
||||||
|
<param name="compile_files" value="${basedir}/src/main/java"/> |
||||||
|
</antcall> |
||||||
|
<echo message="compile plugin success!"/> |
||||||
|
|
||||||
|
<antcall target="jar_classes"> |
||||||
|
<param name="jar_name" value="${plugin-jar}"/> |
||||||
|
</antcall> |
||||||
|
<delete dir="${classes}"/> |
||||||
|
|
||||||
|
</target> |
||||||
|
|
||||||
|
<target name="jar" depends="super_jar"> |
||||||
|
<antcall target="zip"/> |
||||||
|
</target> |
||||||
|
|
||||||
|
<target name="zip"> |
||||||
|
<property name="plugin-folder" value="${plugin-name}-${plugin-version}"/> |
||||||
|
<echo message="----------zip files----------"/> |
||||||
|
<mkdir dir="${plugin-folder}"/> |
||||||
|
<copy todir="${plugin-folder}"> |
||||||
|
<fileset dir="."> |
||||||
|
<include name="${plugin-jar}"/> |
||||||
|
<include name="plugin.xml"/> |
||||||
|
<include name="readme.md"/> |
||||||
|
</fileset> |
||||||
|
<fileset dir="${libs}"> |
||||||
|
<include name="*.*"/> |
||||||
|
</fileset> |
||||||
|
</copy> |
||||||
|
<zip destfile="${basedir}/${plugin-folder}.zip" basedir="."> |
||||||
|
<include name="${plugin-folder}/*.*"/> |
||||||
|
</zip> |
||||||
|
<move file="${plugin-folder}.zip" todir="${destLoc}/install"/> |
||||||
|
</target> |
||||||
|
</project> |
||||||
@ -1,26 +1,21 @@ |
|||||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?><plugin> |
<?xml version="1.0" encoding="UTF-8" standalone="no"?> |
||||||
<id>com.fanruan.plugin.template.uuid</id> |
<plugin> |
||||||
<name><![CDATA[插件名字]]></name> |
<id>com.finebi.plugin.custom.chart.demo.v6</id> |
||||||
|
<name><![CDATA[自定义图表demo]]></name> |
||||||
<active>yes</active> |
<active>yes</active> |
||||||
<version>1.0.0</version> |
<version>1.6.0</version> |
||||||
<env-version>10.0</env-version> |
<env-version>11.0~11.0</env-version> |
||||||
<jartime>2020-08-08</jartime> |
<bi-env-version>6.0~</bi-env-version> |
||||||
<vendor>author</vendor> |
<jartime>2023-05-16</jartime> |
||||||
<description><![CDATA[插件介绍。]]></description> |
<vendor>fanruan</vendor> |
||||||
|
<description><![CDATA[自定义图表demo]]></description> |
||||||
<change-notes><![CDATA[ |
<change-notes><![CDATA[ |
||||||
[2020-08-08]初始化插件。<br/> |
[2023-06-01] demo |
||||||
]]></change-notes> |
]]></change-notes> |
||||||
<extra-core> |
|
||||||
</extra-core> |
|
||||||
|
|
||||||
<extra-decision> |
|
||||||
</extra-decision> |
|
||||||
|
|
||||||
<extra-report> |
<main-package>com</main-package> |
||||||
</extra-report> |
<function-recorder class="com.finebi.plugin.custom.component.DemoComponentProvider"/> |
||||||
|
<extra-core> |
||||||
<extra-designer> |
<CustomComponentProvider class="com.finebi.plugin.custom.component.DemoComponentProvider"/> |
||||||
</extra-designer> |
</extra-core> |
||||||
|
|
||||||
<function-recorder class=""/> |
|
||||||
</plugin> |
</plugin> |
||||||
@ -0,0 +1,42 @@ |
|||||||
|
<?xml version="1.0" encoding="UTF-8"?> |
||||||
|
<project xmlns="http://maven.apache.org/POM/4.0.0" |
||||||
|
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" |
||||||
|
xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd"> |
||||||
|
<modelVersion>4.0.0</modelVersion> |
||||||
|
<parent> |
||||||
|
<groupId>com.finebi.project</groupId> |
||||||
|
<artifactId>nuclear-maven</artifactId> |
||||||
|
<version>5.0-RELEASE-SNAPSHOT</version> |
||||||
|
<relativePath>../nuclear-maven/pom.xml</relativePath> |
||||||
|
</parent> |
||||||
|
|
||||||
|
<artifactId>plugin-bi-custom-chart-demo</artifactId> |
||||||
|
|
||||||
|
<properties> |
||||||
|
<maven.compiler.source>8</maven.compiler.source> |
||||||
|
<maven.compiler.target>8</maven.compiler.target> |
||||||
|
<project.build.sourceEncoding>UTF-8</project.build.sourceEncoding> |
||||||
|
</properties> |
||||||
|
<dependencies> |
||||||
|
<dependency> |
||||||
|
<groupId>com.finebi</groupId> |
||||||
|
<artifactId>common-service</artifactId> |
||||||
|
<version>5.0-RELEASE-SNAPSHOT</version> |
||||||
|
<scope>compile</scope> |
||||||
|
</dependency> |
||||||
|
</dependencies> |
||||||
|
<build> |
||||||
|
<!---如果要更改调试插件，改这里的配置就可以了--> |
||||||
|
<outputDirectory>D:\apache-tomcat-9.0.73\webapps\webroot\WEB-INF/plugins/plugin-com.finebi.plugin.custom.chart.demo.v6/classes</outputDirectory> |
||||||
|
<plugins> |
||||||
|
<plugin> |
||||||
|
<groupId>org.apache.maven.plugins</groupId> |
||||||
|
<artifactId>maven-compiler-plugin</artifactId> |
||||||
|
<configuration> |
||||||
|
<source>8</source> |
||||||
|
<target>8</target> |
||||||
|
</configuration> |
||||||
|
</plugin> |
||||||
|
</plugins> |
||||||
|
</build> |
||||||
|
</project> |
||||||
@ -0,0 +1,27 @@ |
|||||||
|
package com.finebi.plugin.custom.component; |
||||||
|
|
||||||
|
import com.fr.web.struct.AssembleComponent; |
||||||
|
import com.fr.web.struct.Atom; |
||||||
|
import com.fr.web.struct.browser.RequestClient; |
||||||
|
import com.fr.web.struct.category.ParserType; |
||||||
|
import com.fr.web.struct.category.ScriptPath; |
||||||
|
import com.fr.web.struct.category.StylePath; |
||||||
|
|
||||||
|
public class CustomComponent extends AssembleComponent { |
||||||
|
public static final CustomComponent KEY = new CustomComponent(); |
||||||
|
|
||||||
|
@Override |
||||||
|
public Atom[] refer() { |
||||||
|
return new Atom[0]; |
||||||
|
} |
||||||
|
|
||||||
|
@Override |
||||||
|
public ScriptPath script(RequestClient req) { |
||||||
|
return ScriptPath.build("/com/finebi/plugin/custom/component/demo.js"); |
||||||
|
} |
||||||
|
|
||||||
|
@Override |
||||||
|
public StylePath style(RequestClient req) { |
||||||
|
return StylePath.build("/com/finebi/plugin/custom/component/demo.css", ParserType.DYNAMIC); |
||||||
|
} |
||||||
|
} |
||||||
@ -0,0 +1,86 @@ |
|||||||
|
package com.finebi.plugin.custom.component; |
||||||
|
|
||||||
|
import com.finebi.common.api.service.plugin.common.context.OperationContext; |
||||||
|
import com.finebi.common.api.service.plugin.component.AbstractCustomComponentProvider; |
||||||
|
import com.fr.general.IOUtils; |
||||||
|
import com.fr.plugin.transform.ExecuteFunctionRecord; |
||||||
|
import com.fr.plugin.transform.FunctionRecorder; |
||||||
|
import com.fr.web.struct.AssembleComponent; |
||||||
|
|
||||||
|
@FunctionRecorder |
||||||
|
public class DemoComponentProvider extends AbstractCustomComponentProvider{ |
||||||
|
/** |
||||||
|
* 自定义图表名称 |
||||||
|
*/ |
||||||
|
@Override |
||||||
|
public String getName() { |
||||||
|
return "自定义图表demo"; |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 自定义图表类型 |
||||||
|
*/ |
||||||
|
@Override |
||||||
|
public String getType() { |
||||||
|
return "demo"; |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 自定义图表 icon |
||||||
|
*/ |
||||||
|
@Override |
||||||
|
public String getIcon() { |
||||||
|
return "http://webapi.amap.com/theme/v1.3/mapinfo_05.png"; |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 空自定义图表提示，不写默认取 icon |
||||||
|
*/ |
||||||
|
@Override |
||||||
|
public String getPreviewIcon() { |
||||||
|
return "http://webapi.amap.com/theme/v1.3/mapinfo_05.png"; |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 自定义图表预览 dom，注入依赖文件和挂载节点，可以获取 context |
||||||
|
* @param context 上下文 |
||||||
|
*/ |
||||||
|
@ExecuteFunctionRecord |
||||||
|
@Override |
||||||
|
public String getPreviewPageHTML(OperationContext context) { |
||||||
|
return "<link rel=\"stylesheet\" type=\"text/css\" href=\"https://fanruan.design/fineui/2.0/fineui.min.css\" />" + |
||||||
|
"<script src=\"https://fanruan.design/fineui/2.0/fineui.min.js\"></script>" + |
||||||
|
"<div>context: </div>" + context.getSystemInfo() + context.getUserInfo() + |
||||||
|
"<div id=\"container\">这是预览</div>"; |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 自定义图表编辑 dom，不写默认取预览 |
||||||
|
* @param context 上下文 |
||||||
|
*/ |
||||||
|
@ExecuteFunctionRecord |
||||||
|
@Override |
||||||
|
public String getEditPageHTML(OperationContext context) { |
||||||
|
return "<link rel=\"stylesheet\" type=\"text/css\" href=\"https://fanruan.design/fineui/2.0/fineui.min.css\" />" + |
||||||
|
"<script src=\"https://fanruan.design/fineui/2.0/fineui.min.js\"></script>" + |
||||||
|
"<div>context: </div>" + context.getSystemInfo() + context.getUserInfo() + |
||||||
|
"<div id=\"container\">这是编辑</div>"; |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 自定义图表渲染 js、css 注入 |
||||||
|
* @param context 上下文 |
||||||
|
*/ |
||||||
|
@Override |
||||||
|
public AssembleComponent previewClient(OperationContext context) { |
||||||
|
return CustomComponent.KEY; |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 自定义图表配置文件 |
||||||
|
*/ |
||||||
|
@Override |
||||||
|
public String config() { |
||||||
|
return IOUtils.readResourceAsString("com/finebi/plugin/custom/component/config.json"); |
||||||
|
} |
||||||
|
} |
||||||
@ -0,0 +1,196 @@ |
|||||||
|
{ |
||||||
|
"dataRegions": [ |
||||||
|
{ |
||||||
|
"name": "自定义数据1" |
||||||
|
}, |
||||||
|
{ |
||||||
|
"name": "自定义数据2" |
||||||
|
} |
||||||
|
], |
||||||
|
"attrRegions": [ |
||||||
|
{ |
||||||
|
"name": "颜色1", |
||||||
|
"multiFields": false, |
||||||
|
"settings": "color" |
||||||
|
}, |
||||||
|
{ |
||||||
|
"name": "大小1", |
||||||
|
"multiFields": true, |
||||||
|
"settings": "size" |
||||||
|
}, |
||||||
|
{ |
||||||
|
"name": "形状1", |
||||||
|
"multiFields": false, |
||||||
|
"settings": "symbol" |
||||||
|
}, |
||||||
|
{ |
||||||
|
"name": "自定选项", |
||||||
|
"multiFields": false, |
||||||
|
"settings": [ |
||||||
|
{ |
||||||
|
"name": "Checkbox", |
||||||
|
"type": "Checkbox", |
||||||
|
"defaultValue": ["2", "3"], |
||||||
|
"items": [ |
||||||
|
{ |
||||||
|
"text": "选项1", |
||||||
|
"value": "1" |
||||||
|
}, |
||||||
|
{ |
||||||
|
"text": "选项2", |
||||||
|
"value": "2" |
||||||
|
}, |
||||||
|
{ |
||||||
|
"text": "选项2", |
||||||
|
"value": "3" |
||||||
|
} |
||||||
|
] |
||||||
|
}, |
||||||
|
{ |
||||||
|
"name": "RadioGroup", |
||||||
|
"type": "RadioGroup", |
||||||
|
"defaultValue": "2", |
||||||
|
"items": [ |
||||||
|
{ |
||||||
|
"text": "选项1", |
||||||
|
"value": "1" |
||||||
|
}, |
||||||
|
{ |
||||||
|
"text": "选项2", |
||||||
|
"value": "2" |
||||||
|
} |
||||||
|
] |
||||||
|
}, |
||||||
|
{ |
||||||
|
"name": "Segment", |
||||||
|
"type": "Segment", |
||||||
|
"defaultValue": "2", |
||||||
|
"items": [ |
||||||
|
{ |
||||||
|
"text": "选项1", |
||||||
|
"value": "1" |
||||||
|
}, |
||||||
|
{ |
||||||
|
"text": "选项2", |
||||||
|
"value": "2" |
||||||
|
} |
||||||
|
] |
||||||
|
}, |
||||||
|
{ |
||||||
|
"name": "Select", |
||||||
|
"type": "Select", |
||||||
|
"defaultValue": "1", |
||||||
|
"items": [ |
||||||
|
{ |
||||||
|
"text": "选项1", |
||||||
|
"value": "1" |
||||||
|
}, |
||||||
|
{ |
||||||
|
"text": "选项2", |
||||||
|
"value": "2" |
||||||
|
} |
||||||
|
] |
||||||
|
}, |
||||||
|
{ |
||||||
|
"name": "ColorPicker", |
||||||
|
"type": "ColorPicker", |
||||||
|
"defaultValue": "#ffffff" |
||||||
|
}, |
||||||
|
{ |
||||||
|
"name": "Input", |
||||||
|
"type": "Input", |
||||||
|
"defaultValue": "test" |
||||||
|
} |
||||||
|
] |
||||||
|
}, |
||||||
|
{ |
||||||
|
"name": "属性1属性1属性1", |
||||||
|
"multiFields": true |
||||||
|
}, |
||||||
|
{ |
||||||
|
"name": "属性2", |
||||||
|
"multiFields": false |
||||||
|
} |
||||||
|
], |
||||||
|
"chartStyles": [ |
||||||
|
{ |
||||||
|
"name": "自定选项", |
||||||
|
"settings": [ |
||||||
|
{ |
||||||
|
"name": "Checkbox", |
||||||
|
"type": "Checkbox", |
||||||
|
"defaultValue": ["2", "3"], |
||||||
|
"items": [ |
||||||
|
{ |
||||||
|
"text": "选项1", |
||||||
|
"value": "1" |
||||||
|
}, |
||||||
|
{ |
||||||
|
"text": "选项2", |
||||||
|
"value": "2" |
||||||
|
}, |
||||||
|
{ |
||||||
|
"text": "选项2", |
||||||
|
"value": "3" |
||||||
|
} |
||||||
|
] |
||||||
|
}, |
||||||
|
{ |
||||||
|
"name": "RadioGroup", |
||||||
|
"type": "RadioGroup", |
||||||
|
"defaultValue": "2", |
||||||
|
"items": [ |
||||||
|
{ |
||||||
|
"text": "选项1", |
||||||
|
"value": "1" |
||||||
|
}, |
||||||
|
{ |
||||||
|
"text": "选项2", |
||||||
|
"value": "2" |
||||||
|
} |
||||||
|
] |
||||||
|
}, |
||||||
|
{ |
||||||
|
"name": "Segment", |
||||||
|
"type": "Segment", |
||||||
|
"defaultValue": "2", |
||||||
|
"items": [ |
||||||
|
{ |
||||||
|
"text": "选项1", |
||||||
|
"value": "1" |
||||||
|
}, |
||||||
|
{ |
||||||
|
"text": "选项2", |
||||||
|
"value": "2" |
||||||
|
} |
||||||
|
] |
||||||
|
}, |
||||||
|
{ |
||||||
|
"name": "Select", |
||||||
|
"type": "Select", |
||||||
|
"defaultValue": "1", |
||||||
|
"items": [ |
||||||
|
{ |
||||||
|
"text": "选项1", |
||||||
|
"value": "1" |
||||||
|
}, |
||||||
|
{ |
||||||
|
"text": "选项2", |
||||||
|
"value": "2" |
||||||
|
} |
||||||
|
] |
||||||
|
}, |
||||||
|
{ |
||||||
|
"name": "ColorPicker", |
||||||
|
"type": "ColorPicker", |
||||||
|
"defaultValue": "#ffffff" |
||||||
|
}, |
||||||
|
{ |
||||||
|
"name": "Input", |
||||||
|
"type": "Input", |
||||||
|
"defaultValue": "test" |
||||||
|
} |
||||||
|
] |
||||||
|
} |
||||||
|
] |
||||||
|
} |
||||||
@ -0,0 +1,3 @@ |
|||||||
|
*{ |
||||||
|
font-size: 20px; |
||||||
|
} |
||||||
@ -0,0 +1,219 @@ |
|||||||
|
function render( |
||||||
|
data, |
||||||
|
config, |
||||||
|
saveSessionCallback, |
||||||
|
// 暂时没用
|
||||||
|
closeSessionCallBack, |
||||||
|
extensionCallBack |
||||||
|
) { |
||||||
|
const { |
||||||
|
// 数据，若横纵轴多指标时图表属性有维度字段，dataModels 为以图表属性为分组的多组数据
|
||||||
|
dataModels, |
||||||
|
// 横纵轴拖入字段的维度 id
|
||||||
|
dataMapping, |
||||||
|
// 图表属性拖入字段的维度 id
|
||||||
|
chartAttrMapping, |
||||||
|
// 图表点击值
|
||||||
|
clicked |
||||||
|
} = data; |
||||||
|
|
||||||
|
const { |
||||||
|
// 组件 id
|
||||||
|
widgetId, |
||||||
|
// 全局样式中图表最终样式
|
||||||
|
globalStyles, |
||||||
|
// 图表属性配置所选值
|
||||||
|
chartAttr, |
||||||
|
// 图表样式配置所选值
|
||||||
|
chartStyle, |
||||||
|
// 图标属性中使用形状时的图标映射
|
||||||
|
symbolIconMap, |
||||||
|
// 自定义保存的值(saveSessionCallback)
|
||||||
|
customConfig |
||||||
|
} = config; |
||||||
|
|
||||||
|
const refs = {}; |
||||||
|
|
||||||
|
// demo 仅使用表格模拟
|
||||||
|
BI.createWidget({ |
||||||
|
type: 'bi.vertical', |
||||||
|
element: '#container', |
||||||
|
items: [ |
||||||
|
{ |
||||||
|
type: 'bi.label', |
||||||
|
text: |
||||||
|
'dataMapping(横纵轴拖入字段的维度 id): ' + |
||||||
|
JSON.stringify(dataMapping) |
||||||
|
}, |
||||||
|
{ |
||||||
|
type: 'bi.label', |
||||||
|
text: |
||||||
|
'chartAttrMapping(图表属性拖入字段的维度 id): ' + |
||||||
|
JSON.stringify(chartAttrMapping) |
||||||
|
}, |
||||||
|
{ |
||||||
|
type: 'bi.label', |
||||||
|
text: 'widgetId(组件 id): ' + JSON.stringify(widgetId) |
||||||
|
}, |
||||||
|
{ |
||||||
|
type: 'bi.label', |
||||||
|
text: |
||||||
|
'globalStyles(全局样式中图表最终样式): ' + |
||||||
|
JSON.stringify(globalStyles) |
||||||
|
}, |
||||||
|
{ |
||||||
|
type: 'bi.label', |
||||||
|
text: |
||||||
|
'chartAttr(图表属性配置所选值): ' + |
||||||
|
JSON.stringify(chartAttr) |
||||||
|
}, |
||||||
|
{ |
||||||
|
type: 'bi.label', |
||||||
|
text: |
||||||
|
'chartStyle(图表样式配置所选值): ' + |
||||||
|
JSON.stringify(chartStyle) |
||||||
|
}, |
||||||
|
{ |
||||||
|
type: 'bi.label', |
||||||
|
text: |
||||||
|
'symbolIconMap(图标属性中使用形状时的图标映射): ' + |
||||||
|
JSON.stringify(symbolIconMap) |
||||||
|
}, |
||||||
|
{ |
||||||
|
type: 'bi.label', |
||||||
|
text: |
||||||
|
'customConfig(自定义保存的值(saveSessionCallback)): ' + |
||||||
|
JSON.stringify(customConfig) |
||||||
|
}, |
||||||
|
{ |
||||||
|
type: 'bi.vertical', |
||||||
|
items: dataModels.map(dataModel => { |
||||||
|
const { fields, colData } = dataModel; |
||||||
|
|
||||||
|
return { |
||||||
|
type: 'bi.vertical', |
||||||
|
items: [ |
||||||
|
{ |
||||||
|
type: 'bi.vertical_adapt', |
||||||
|
items: fields.map(field => { |
||||||
|
return { |
||||||
|
type: 'bi.label', |
||||||
|
text: field.name, |
||||||
|
rgap: 5 |
||||||
|
}; |
||||||
|
}) |
||||||
|
}, |
||||||
|
{ |
||||||
|
type: 'bi.vertical_adapt', |
||||||
|
items: colData.map((data, colIndex) => { |
||||||
|
// 维度id
|
||||||
|
const dId = fields[colIndex].id; |
||||||
|
|
||||||
|
return { |
||||||
|
type: 'bi.vertical', |
||||||
|
items: data.map((text, dataIndex) => { |
||||||
|
const key = |
||||||
|
'' + colIndex + dataIndex; |
||||||
|
|
||||||
|
// 构造当前联动点击值对象
|
||||||
|
const value = []; |
||||||
|
for ( |
||||||
|
let i = 0; |
||||||
|
i <= colIndex; |
||||||
|
i++ |
||||||
|
) { |
||||||
|
// 当前维度和之前维度的id及对应值
|
||||||
|
value.push({ |
||||||
|
dId: fields[i].id, |
||||||
|
text: colData[i][dataIndex] |
||||||
|
}); |
||||||
|
} |
||||||
|
// 联动点击值对象
|
||||||
|
const currentClicked = { |
||||||
|
dId, |
||||||
|
value |
||||||
|
}; |
||||||
|
|
||||||
|
return { |
||||||
|
type: 'bi.label', |
||||||
|
height: 30, |
||||||
|
rgap: 5, |
||||||
|
text, |
||||||
|
cls: isClicked( |
||||||
|
clicked, |
||||||
|
currentClicked |
||||||
|
) |
||||||
|
? 'bi-border' |
||||||
|
: '', |
||||||
|
ref: ref => { |
||||||
|
refs[key] = ref; |
||||||
|
}, |
||||||
|
handler: () => { |
||||||
|
BI.each(refs, (_, ref) => { |
||||||
|
ref.element.removeClass( |
||||||
|
'bi-border' |
||||||
|
); |
||||||
|
}); |
||||||
|
refs[key].element.addClass( |
||||||
|
'bi-border' |
||||||
|
); |
||||||
|
|
||||||
|
// 触发联动
|
||||||
|
extensionCallBack( |
||||||
|
'click', |
||||||
|
currentClicked |
||||||
|
); |
||||||
|
|
||||||
|
// 模拟自定义保存值，可以是任意值，通过 customConfig 原样返回
|
||||||
|
saveSessionCallback({ |
||||||
|
saveValue: |
||||||
|
currentClicked |
||||||
|
}); |
||||||
|
} |
||||||
|
}; |
||||||
|
}) |
||||||
|
}; |
||||||
|
}) |
||||||
|
} |
||||||
|
] |
||||||
|
}; |
||||||
|
}) |
||||||
|
} |
||||||
|
] |
||||||
|
}); |
||||||
|
} |
||||||
|
// 注册渲染方法
|
||||||
|
new BIPlugin().init(render); |
||||||
|
|
||||||
|
// 判断当前数据是否为点击值
|
||||||
|
function isClicked(clicked, currentClicked) { |
||||||
|
function valueEq(v1, v2) { |
||||||
|
if (v1 === v2) { |
||||||
|
return true; |
||||||
|
} |
||||||
|
if (!BI.isArray(v1) || !BI.isArray(v2)) { |
||||||
|
return false; |
||||||
|
} |
||||||
|
if (v1.length !== v2.length) { |
||||||
|
return false; |
||||||
|
} |
||||||
|
|
||||||
|
return !BI.some(v1, (i, v) => { |
||||||
|
const textEq = BI.isNull(v.text) |
||||||
|
? BI.isNull(v.text) !== BI.isNull(v2[i].text) |
||||||
|
: v.text !== v2[i].text; |
||||||
|
|
||||||
|
return v.dId !== v2[i].dId || textEq; |
||||||
|
}); |
||||||
|
} |
||||||
|
|
||||||
|
if (BI.isNull(clicked) || BI.isNull(currentClicked)) { |
||||||
|
return false; |
||||||
|
} |
||||||
|
|
||||||
|
return ( |
||||||
|
clicked.dId === currentClicked.dId && |
||||||
|
valueEq(clicked.value, currentClicked.value) |
||||||
|
); |
||||||
|
} |
||||||
|
|
||||||
Loading…
Reference in new issue