Compare commits
2 Commits
Author | SHA1 | Date | |
---|---|---|---|
51522a82c4 | |||
2bf187679e |
26
ReadMe.md
26
ReadMe.md
@ -1,26 +0,0 @@
|
|||||||
# A utility slicer for Power Bi
|
|
||||||
Assign default selection to this slicer by messures, just use DAX!
|
|
||||||
## Tutorial
|
|
||||||
1. Click the top right corner of this slicer
|
|
||||||
1. Click "Edit"
|
|
||||||
1. Save&publish the report
|
|
||||||
## Functionalities
|
|
||||||
* Implemented
|
|
||||||
1. Dropdown-slicer for text field
|
|
||||||
1. Use DAX to assign **single** default selected items to the dropdown-slicer
|
|
||||||
1. Support async slicers
|
|
||||||
* Planned
|
|
||||||
1. List-slicer for text field
|
|
||||||
1. Use DAX to assign **one** default selected items to the list-slicer
|
|
||||||
1. Use DAX to assign **multiple** default selected items to the dropdown-slicer and list-slicer
|
|
||||||
1. Range-slicer for number field
|
|
||||||
1. Use DAX to assign default selected range to the range-slicer
|
|
||||||
1. Single-date-slicer for datetime field
|
|
||||||
1. Use DAX to assign default selected date to the single-date-slicer
|
|
||||||
1. Period-slicer for datetime field
|
|
||||||
1. Use DAX to assign default selected period to the period-slicer
|
|
||||||
## Known issures
|
|
||||||
1. Slicer components for number field and datetime field are in developing, just slicer for text field is usable now
|
|
||||||
1. The outline setting has no effectivity on dropdown items
|
|
||||||
1. I can't change background-color of dropdown items
|
|
||||||
1. This slicer wouldn't support bookmarks
|
|
@ -1,6 +1,4 @@
|
|||||||
{
|
{
|
||||||
"supportsSynchronizingFilterState": true,
|
|
||||||
"advancedEditModeSupport": 1,
|
|
||||||
"dataRoles": [
|
"dataRoles": [
|
||||||
{
|
{
|
||||||
"displayName": "Field",
|
"displayName": "Field",
|
||||||
@ -48,7 +46,7 @@
|
|||||||
"objects": {
|
"objects": {
|
||||||
"general": {
|
"general": {
|
||||||
"displayName": "General",
|
"displayName": "General",
|
||||||
"displayNameKey": "Formatting-General",
|
"displayNameKey": "formattingGeneral",
|
||||||
"properties": {
|
"properties": {
|
||||||
"filter": {
|
"filter": {
|
||||||
"type": {
|
"type": {
|
||||||
@ -64,12 +62,11 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"slicerHeader": {
|
"dataPoint": {
|
||||||
"displayName": "Slicer header",
|
"displayName": "Data colors",
|
||||||
"displayNameKey":"Formatting-SicerHeader",
|
|
||||||
"properties": {
|
"properties": {
|
||||||
"fontColor": {
|
"defaultColor": {
|
||||||
"displayName": "Font color",
|
"displayName": "Default color",
|
||||||
"type": {
|
"type": {
|
||||||
"fill": {
|
"fill": {
|
||||||
"solid": {
|
"solid": {
|
||||||
@ -78,79 +75,6 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"backgroundColor": {
|
|
||||||
"displayName": "Background color",
|
|
||||||
"type": {
|
|
||||||
"fill": {
|
|
||||||
"solid": {
|
|
||||||
"color": true
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"outline":{
|
|
||||||
"displayName": "Outline",
|
|
||||||
"type": {
|
|
||||||
"enumeration": [
|
|
||||||
{
|
|
||||||
"value": "0",
|
|
||||||
"displayName": "None",
|
|
||||||
"displayNameKey": "Formatting_Outline_None"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"value": "1",
|
|
||||||
"displayName": "Bottom only",
|
|
||||||
"displayNameKey": "Formatting_Outline_BottomOnly"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"value": "2",
|
|
||||||
"displayName": "Top only",
|
|
||||||
"displayNameKey": "Formatting_Outline_TopOnly"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"value": "3",
|
|
||||||
"displayName": "Left only",
|
|
||||||
"displayNameKey": "Formatting_Outline_LeftOnly"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"value": "4",
|
|
||||||
"displayName": "Right only",
|
|
||||||
"displayNameKey": "Formatting_Outline_RightOnly"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"value": "5",
|
|
||||||
"displayName": "Top + bottom",
|
|
||||||
"displayNameKey": "Formatting_Outline_TopAndBottom"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"value": "6",
|
|
||||||
"displayName": "Left + right",
|
|
||||||
"displayNameKey": "Formatting_Outline_LeftAndRight"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"value": "7",
|
|
||||||
"displayName": "Frame",
|
|
||||||
"displayNameKey": "Formatting_Outline_Frame"
|
|
||||||
}
|
|
||||||
]
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"outlineColor":{
|
|
||||||
"displayName": "Outline color",
|
|
||||||
"type": {
|
|
||||||
"fill": {
|
|
||||||
"solid": {
|
|
||||||
"color":true
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"outlineWeight":{
|
|
||||||
"displayName": "Outline weight",
|
|
||||||
"type":{
|
|
||||||
"integer": true
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"showAllDataPoints": {
|
"showAllDataPoints": {
|
||||||
"displayName": "Show all",
|
"displayName": "Show all",
|
||||||
"type": {
|
"type": {
|
||||||
@ -182,90 +106,6 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
|
||||||
"items":{
|
|
||||||
"displayName": "Items",
|
|
||||||
"displayNameKey": "Formatting_Items",
|
|
||||||
"properties": {
|
|
||||||
"fontColor": {
|
|
||||||
"displayName": "Font color",
|
|
||||||
"displayNameKey": "Formatting_Items_FontColor",
|
|
||||||
"type": {
|
|
||||||
"fill": {
|
|
||||||
"solid": {
|
|
||||||
"color": true
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"backgroundColor": {
|
|
||||||
"displayName": "Background color",
|
|
||||||
"displayNameKey": "Formatting_Items_BackgroundColor",
|
|
||||||
|
|
||||||
"type": {
|
|
||||||
"fill": {
|
|
||||||
"solid": {
|
|
||||||
"color": true
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"outline":{
|
|
||||||
"displayName": "Outline",
|
|
||||||
"displayNameKey": "Formatting_Items_Outline",
|
|
||||||
"type": {
|
|
||||||
"enumeration": [
|
|
||||||
{
|
|
||||||
"value": "0",
|
|
||||||
"displayName": "None",
|
|
||||||
"displayNameKey": "Formatting_Outline_None"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"value": "1",
|
|
||||||
"displayName": "Bottom only",
|
|
||||||
"displayNameKey": "Formatting_Outline_BottomOnly"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"value": "2",
|
|
||||||
"displayName": "Top only",
|
|
||||||
"displayNameKey": "Formatting_Outline_TopOnly"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"value": "3",
|
|
||||||
"displayName": "Left only",
|
|
||||||
"displayNameKey": "Formatting_Outline_LeftOnly"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"value": "4",
|
|
||||||
"displayName": "Right only",
|
|
||||||
"displayNameKey": "Formatting_Outline_RightOnly"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"value": "5",
|
|
||||||
"displayName": "Top + bottom",
|
|
||||||
"displayNameKey": "Formatting_Outline_TopAndBottom"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"value": "6",
|
|
||||||
"displayName": "Left + right",
|
|
||||||
"displayNameKey": "Formatting_Outline_LeftAndRight"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"value": "7",
|
|
||||||
"displayName": "Frame",
|
|
||||||
"displayNameKey": "Formatting_Outline_Frame"
|
|
||||||
}
|
|
||||||
]
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"textSize":{
|
|
||||||
"displayName": "Text size",
|
|
||||||
"displayNameKey": "Formatting_Items_TextSize",
|
|
||||||
"type":{
|
|
||||||
"integer": true
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"dataViewMappings": [
|
"dataViewMappings": [
|
||||||
|
56
package-lock.json
generated
56
package-lock.json
generated
@ -53,6 +53,23 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"@types/bootstrap": {
|
||||||
|
"version": "3.4.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/@types/bootstrap/-/bootstrap-3.4.0.tgz",
|
||||||
|
"integrity": "sha512-LS05hVAAsX86qbHg7W+ydwBlNHrVCoFw6wEP3/uW4eYmRXl08bWmPeN/+onM+8qZTFfDgUlG/OItJI8SW972oQ==",
|
||||||
|
"requires": {
|
||||||
|
"@types/jquery": "*"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"@types/bootstrap-multiselect": {
|
||||||
|
"version": "0.9.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/@types/bootstrap-multiselect/-/bootstrap-multiselect-0.9.0.tgz",
|
||||||
|
"integrity": "sha512-tJU7V4ORRMdyqA9GoN6KepewlQwKjcCPQC4GrP2cow/ixr1FO6hi4FKfVrgxLg/KnRKCZvJnNthvSXz1y7qqRQ==",
|
||||||
|
"dev": true,
|
||||||
|
"requires": {
|
||||||
|
"@types/jquery": "*"
|
||||||
|
}
|
||||||
|
},
|
||||||
"@types/d3": {
|
"@types/d3": {
|
||||||
"version": "5.7.2",
|
"version": "5.7.2",
|
||||||
"resolved": "https://registry.npmjs.org/@types/d3/-/d3-5.7.2.tgz",
|
"resolved": "https://registry.npmjs.org/@types/d3/-/d3-5.7.2.tgz",
|
||||||
@ -286,11 +303,10 @@
|
|||||||
"resolved": "https://registry.npmjs.org/@types/geojson/-/geojson-7946.0.7.tgz",
|
"resolved": "https://registry.npmjs.org/@types/geojson/-/geojson-7946.0.7.tgz",
|
||||||
"integrity": "sha512-wE2v81i4C4Ol09RtsWFAqg3BUitWbHSpSlIo+bNdsCJijO9sjme+zm+73ZMCa/qMC8UEERxzGbvmr1cffo2SiQ=="
|
"integrity": "sha512-wE2v81i4C4Ol09RtsWFAqg3BUitWbHSpSlIo+bNdsCJijO9sjme+zm+73ZMCa/qMC8UEERxzGbvmr1cffo2SiQ=="
|
||||||
},
|
},
|
||||||
"@types/node": {
|
"@types/jquery": {
|
||||||
"version": "13.13.4",
|
"version": "2.0.54",
|
||||||
"resolved": "https://registry.npmjs.org/@types/node/-/node-13.13.4.tgz",
|
"resolved": "https://registry.npmjs.org/@types/jquery/-/jquery-2.0.54.tgz",
|
||||||
"integrity": "sha512-x26ur3dSXgv5AwKS0lNfbjpCakGIduWU1DU91Zz58ONRWrIKGunmZBNv4P7N+e27sJkiGDsw/3fT4AtsqQBrBA==",
|
"integrity": "sha512-D/PomKwNkDfSKD13DEVQT/pq2TUjN54c6uB341fEZanIzkjfGe7UaFuuaLZbpEiS5j7Wk2MUHAZqZIoECw29lg=="
|
||||||
"dev": true
|
|
||||||
},
|
},
|
||||||
"ansi-styles": {
|
"ansi-styles": {
|
||||||
"version": "3.2.1",
|
"version": "3.2.1",
|
||||||
@ -322,6 +338,26 @@
|
|||||||
"integrity": "sha512-vyL2OymJxmarO8gxMr0mhChsO9QGwhynfuu4+MHTAW6czfq9humCB7rKpUjDd9YUiDPU4mzpyupFSvOClAwbmQ==",
|
"integrity": "sha512-vyL2OymJxmarO8gxMr0mhChsO9QGwhynfuu4+MHTAW6czfq9humCB7rKpUjDd9YUiDPU4mzpyupFSvOClAwbmQ==",
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
|
"bootstrap": {
|
||||||
|
"version": "3.4.1",
|
||||||
|
"resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-3.4.1.tgz",
|
||||||
|
"integrity": "sha512-yN5oZVmRCwe5aKwzRj6736nSmKDX7pLYwsXiCj/EYmo16hODaBiT4En5btW/jhBF/seV+XMx3aYwukYC3A49DA=="
|
||||||
|
},
|
||||||
|
"bootstrap-multiselect": {
|
||||||
|
"version": "0.9.15",
|
||||||
|
"resolved": "https://registry.npmjs.org/bootstrap-multiselect/-/bootstrap-multiselect-0.9.15.tgz",
|
||||||
|
"integrity": "sha512-UwF32a0QR82xkEEGpuNrn57Bu0b/7DfCuoiOaziSHfQKFj5arR6c7+MYLs5RiIf3zl4XZ+YnY7ZBi6/EN3vEZA==",
|
||||||
|
"requires": {
|
||||||
|
"jquery": "~2.1.3"
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"jquery": {
|
||||||
|
"version": "2.1.4",
|
||||||
|
"resolved": "https://registry.npmjs.org/jquery/-/jquery-2.1.4.tgz",
|
||||||
|
"integrity": "sha1-IoveaYoMYUMdwmMKahVPFYkNIxc="
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
"brace-expansion": {
|
"brace-expansion": {
|
||||||
"version": "1.1.11",
|
"version": "1.1.11",
|
||||||
"resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
|
"resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
|
||||||
@ -780,6 +816,11 @@
|
|||||||
"integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE=",
|
"integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE=",
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
|
"jquery": {
|
||||||
|
"version": "2.2.4",
|
||||||
|
"resolved": "https://registry.npmjs.org/jquery/-/jquery-2.2.4.tgz",
|
||||||
|
"integrity": "sha1-LInWiJterFIqfuoywUUhVZxsvwI="
|
||||||
|
},
|
||||||
"js-tokens": {
|
"js-tokens": {
|
||||||
"version": "4.0.0",
|
"version": "4.0.0",
|
||||||
"resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz",
|
"resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz",
|
||||||
@ -905,11 +946,6 @@
|
|||||||
"resolved": "https://registry.npmjs.org/powerbi-visuals-utils-dataviewutils/-/powerbi-visuals-utils-dataviewutils-2.2.1.tgz",
|
"resolved": "https://registry.npmjs.org/powerbi-visuals-utils-dataviewutils/-/powerbi-visuals-utils-dataviewutils-2.2.1.tgz",
|
||||||
"integrity": "sha512-Ai+TM1gj6DpAsNbn0IhOwUCAPfcaH4Z7y6Ow2OwAfbxNpELwQSF0S8D+vlJN2AoqV/ruQhnEngUC88mMFNyvJQ=="
|
"integrity": "sha512-Ai+TM1gj6DpAsNbn0IhOwUCAPfcaH4Z7y6Ow2OwAfbxNpELwQSF0S8D+vlJN2AoqV/ruQhnEngUC88mMFNyvJQ=="
|
||||||
},
|
},
|
||||||
"powerbi-visuals-utils-typeutils": {
|
|
||||||
"version": "2.2.1",
|
|
||||||
"resolved": "https://registry.npmjs.org/powerbi-visuals-utils-typeutils/-/powerbi-visuals-utils-typeutils-2.2.1.tgz",
|
|
||||||
"integrity": "sha512-xm5xNBVudCiU9ZZggsLlpHr+a4bnHtgw6Cy1UtNM/zILtOE2HUamjw+yZovLe6YNov4N2EaCmPO8XPhcXkuz+A=="
|
|
||||||
},
|
|
||||||
"process-nextick-args": {
|
"process-nextick-args": {
|
||||||
"version": "2.0.1",
|
"version": "2.0.1",
|
||||||
"resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-2.0.1.tgz",
|
"resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-2.0.1.tgz",
|
||||||
|
10
package.json
10
package.json
@ -9,16 +9,20 @@
|
|||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@babel/runtime": "7.6.0",
|
"@babel/runtime": "7.6.0",
|
||||||
"@babel/runtime-corejs2": "7.6.0",
|
"@babel/runtime-corejs2": "7.6.0",
|
||||||
|
"@types/bootstrap": "^3.4.0",
|
||||||
"@types/d3": "5.7.2",
|
"@types/d3": "5.7.2",
|
||||||
|
"@types/jquery": "^2.0.54",
|
||||||
|
"bootstrap": "^3.4.1",
|
||||||
|
"bootstrap-multiselect": "^0.9.15",
|
||||||
"core-js": "3.2.1",
|
"core-js": "3.2.1",
|
||||||
"d3": "5.12.0",
|
"d3": "5.12.0",
|
||||||
|
"jquery": "^2.2.4",
|
||||||
"powerbi-models": "^1.3.3",
|
"powerbi-models": "^1.3.3",
|
||||||
"powerbi-visuals-api": "~2.6.1",
|
"powerbi-visuals-api": "~2.6.1",
|
||||||
"powerbi-visuals-utils-dataviewutils": "2.2.1",
|
"powerbi-visuals-utils-dataviewutils": "2.2.1"
|
||||||
"powerbi-visuals-utils-typeutils": "^2.2.1"
|
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@types/node": "^13.13.4",
|
"@types/bootstrap-multiselect": "^0.9.0",
|
||||||
"ts-loader": "6.1.0",
|
"ts-loader": "6.1.0",
|
||||||
"tslint": "^5.18.0",
|
"tslint": "^5.18.0",
|
||||||
"tslint-microsoft-contrib": "^6.2.0",
|
"tslint-microsoft-contrib": "^6.2.0",
|
||||||
|
@ -18,7 +18,10 @@
|
|||||||
"icon": "assets/icon.png"
|
"icon": "assets/icon.png"
|
||||||
},
|
},
|
||||||
"externalJS": [
|
"externalJS": [
|
||||||
"./src/cover.js"
|
"node_modules/jquery/dist/jquery.min.js",
|
||||||
|
"src/coverJquery.js",
|
||||||
|
"node_modules/bootstrap/dist/js/bootstrap.min.js",
|
||||||
|
"node_modules/bootstrap-multiselect/dist/js/bootstrap-multiselect.min.js"
|
||||||
],
|
],
|
||||||
"style": "style/visual.less",
|
"style": "style/visual.less",
|
||||||
"capabilities": "capabilities.json",
|
"capabilities": "capabilities.json",
|
||||||
|
@ -1,7 +0,0 @@
|
|||||||
var Debug=true;
|
|
||||||
function blankConsoleDebug(){
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
if(!Debug){
|
|
||||||
console.debug=blankConsoleDebug;
|
|
||||||
}
|
|
3
src/coverJquery.js
Normal file
3
src/coverJquery.js
Normal file
@ -0,0 +1,3 @@
|
|||||||
|
var jQuery = typeof jQuery !== 'undefined'
|
||||||
|
? jQuery
|
||||||
|
: window['$'];
|
@ -11,48 +11,9 @@ import { select, json } from "d3";
|
|||||||
export class FilterManager implements IFilterManager{
|
export class FilterManager implements IFilterManager{
|
||||||
private target: models.IFilterColumnTarget={table:'',column:''};
|
private target: models.IFilterColumnTarget={table:'',column:''};
|
||||||
private host:IVisualHost;
|
private host:IVisualHost;
|
||||||
private _jsonFilter:models.IAdvancedFilter;
|
|
||||||
|
|
||||||
public get jsonFilter() : models.IAdvancedFilter {
|
|
||||||
return this._jsonFilter;
|
|
||||||
}
|
|
||||||
public get advancedEditModeMark():string{
|
|
||||||
return 'SyinpoSlicer_AdvancedEditMode_'+this.inAdvancedEditMode;
|
|
||||||
}
|
|
||||||
constructor(host:IVisualHost){
|
constructor(host:IVisualHost){
|
||||||
this.host=host;
|
this.host=host;
|
||||||
}
|
}
|
||||||
_inAdvancedEditMode: boolean=false;
|
|
||||||
public set inAdvancedEditMode(newValue:boolean){
|
|
||||||
this._inAdvancedEditMode=this._inAdvancedEditMode?true:newValue;
|
|
||||||
}
|
|
||||||
public get inAdvancedEditMode():boolean{
|
|
||||||
return this._inAdvancedEditMode;
|
|
||||||
}
|
|
||||||
setFilter(jsonFilter:models.IAdvancedFilter,applyNow:boolean): void {
|
|
||||||
jsonFilter.conditions[0].value=this.advancedEditModeMark
|
|
||||||
this._jsonFilter=jsonFilter;
|
|
||||||
if(applyNow){
|
|
||||||
this.applyJsonFilter();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
public applyJsonFilter():void{
|
|
||||||
console.debug('filter manager applyJsonFilter start');
|
|
||||||
this.host.applyJsonFilter(this._jsonFilter,'general','filter',powerbi.FilterAction.merge);
|
|
||||||
console.debug(this.jsonFilter);
|
|
||||||
console.debug('filter manager applyJsonFilter end');
|
|
||||||
|
|
||||||
}
|
|
||||||
public dispose():void{
|
|
||||||
console.debug('filterManager disposing');
|
|
||||||
|
|
||||||
if(this.target.table&&this.target.column){
|
|
||||||
this.clear();
|
|
||||||
}
|
|
||||||
console.debug('filterManager disposed');
|
|
||||||
|
|
||||||
}
|
|
||||||
public clear():void{
|
public clear():void{
|
||||||
console.debug("clear start:");
|
console.debug("clear start:");
|
||||||
this.host.applyJsonFilter(null,"general","filter",powerbi.FilterAction.remove);
|
this.host.applyJsonFilter(null,"general","filter",powerbi.FilterAction.remove);
|
||||||
@ -67,33 +28,17 @@ export class FilterManager implements IFilterManager{
|
|||||||
console.debug("queryName.length:",queryName.length);
|
console.debug("queryName.length:",queryName.length);
|
||||||
console.debug("filterManager update end, now filter:",this.target);
|
console.debug("filterManager update end, now filter:",this.target);
|
||||||
}
|
}
|
||||||
public setFilter_String(selection:string[],applyNow:boolean):void{
|
public filterStringField(selection:string[]):void{
|
||||||
console.debug("setFilter_String start:",selection);
|
console.debug("filterStringField start:",selection);
|
||||||
let conditions:models.IAdvancedFilterCondition[]=[];
|
let jsonFilter:models.IBasicFilter={
|
||||||
|
"$schema": "http://powerbi.com/product/schema#basic",
|
||||||
conditions.push({
|
|
||||||
"operator":"StartsWith",
|
|
||||||
"value":this.advancedEditModeMark
|
|
||||||
});
|
|
||||||
|
|
||||||
selection.forEach(function(item){
|
|
||||||
conditions.push({
|
|
||||||
"operator":"Is",
|
|
||||||
"value":item
|
|
||||||
});
|
|
||||||
});
|
|
||||||
let jsonFilter:models.IAdvancedFilter={
|
|
||||||
"$schema": "http://powerbi.com/product/schema#advanced",
|
|
||||||
"target": this.target,
|
"target": this.target,
|
||||||
"filterType": models.FilterType.Advanced,
|
"filterType": models.FilterType.Basic,
|
||||||
"conditions":conditions,
|
"operator":"In",
|
||||||
"logicalOperator":"Or"
|
"values": selection
|
||||||
}
|
}
|
||||||
console.debug("jsonFilter:",jsonFilter);
|
console.debug("jsonFilter:",jsonFilter);
|
||||||
this._jsonFilter=jsonFilter;
|
this.host.applyJsonFilter(jsonFilter?jsonFilter:null,"general","filter",powerbi.FilterAction.merge);
|
||||||
if(applyNow){
|
console.debug("filterStringField end");
|
||||||
this.applyJsonFilter();
|
|
||||||
}
|
|
||||||
console.debug("setFilter_String end");
|
|
||||||
}
|
}
|
||||||
}
|
}
|
@ -11,24 +11,15 @@ export class LayoutManager implements ILayoutManager{
|
|||||||
// constructor(layout:Selection<HTMLElement>){
|
// constructor(layout:Selection<HTMLElement>){
|
||||||
// this.layout=layout;
|
// this.layout=layout;
|
||||||
// }
|
// }
|
||||||
headerContainer:Selection<HTMLDivElement>
|
header:Selection<HTMLDivElement>
|
||||||
constructor(layout:Selection<HTMLElement>,filterManager:IFilterManager){
|
constructor(layout:Selection<HTMLElement>,filterManager:IFilterManager){
|
||||||
this.layout=layout;
|
this.layout=layout;
|
||||||
this.headerContainer=layout.append("div").classed("header-container",true);
|
this.header=this.layout.append('div').attr('header',true);
|
||||||
this.headerContainer.append('button').attr('clear',true).text('clear').on('click',function(){
|
this.header.append('button').attr('clear',true).text('clear').on('click',function(){
|
||||||
//filterManager.clear();
|
filterManager.clear();
|
||||||
});
|
});
|
||||||
this.headerContainer.style('display','none');
|
|
||||||
}
|
|
||||||
public dispose():void{
|
|
||||||
console.debug('layoutManager disposing');
|
|
||||||
|
|
||||||
this.headerContainer.remove();
|
|
||||||
this.layout.remove();
|
|
||||||
console.debug('layoutManager disposed');
|
|
||||||
|
|
||||||
}
|
}
|
||||||
update(dataView:DataView,width:number,height:number):void{
|
update(dataView:DataView,width:number,height:number):void{
|
||||||
this.layout.style("width",width+"px").style("height",height+"px");
|
//this.layout.style("width",width+"px").style("height",height+"px");
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -2,15 +2,13 @@
|
|||||||
import * as visualInterfaces from "../visual/visualInterfaces";
|
import * as visualInterfaces from "../visual/visualInterfaces";
|
||||||
import * as d3 from "d3";
|
import * as d3 from "d3";
|
||||||
import powerbi from "powerbi-visuals-api";
|
import powerbi from "powerbi-visuals-api";
|
||||||
import { EventEmitter } from "events";
|
|
||||||
type Selection<T extends d3.BaseType> = d3.Selection<T, any, any, any>;
|
type Selection<T extends d3.BaseType> = d3.Selection<T, any, any, any>;
|
||||||
export class ManagerFactory{
|
export class ManagerFactory{
|
||||||
public static CreateLayoutManager(classLayoutManager:visualInterfaces.ILayoutManagerConstructor,container:Selection<HTMLElement>,filterManager:visualInterfaces.IFilterManager):visualInterfaces.ILayoutManager{
|
public static CreateLayoutManager(classLayoutManager:visualInterfaces.ILayoutManagerConstructor,container:Selection<HTMLElement>,filterManager:visualInterfaces.IFilterManager):visualInterfaces.ILayoutManager{
|
||||||
return new classLayoutManager(container,filterManager);
|
return new classLayoutManager(container,filterManager);
|
||||||
}
|
}
|
||||||
public static CreateSelectorManager(classSelectorManager:visualInterfaces.ISelectorManagerConstructor,container:Selection<HTMLElement>):visualInterfaces.ISelectorManager&EventEmitter{
|
public static CreateSelectorManager(classSelectorManager:visualInterfaces.ISelectorManagerConstructor,container:Selection<HTMLElement>,filterManager:visualInterfaces.IFilterManager):visualInterfaces.ISelectorManager{
|
||||||
|
return new classSelectorManager(container,filterManager);
|
||||||
return new classSelectorManager(container);
|
|
||||||
}
|
}
|
||||||
public static CreateFilterManager(classSelectorManager:visualInterfaces.IFilterManagerConstructor,host:powerbi.extensibility.visual.IVisualHost):visualInterfaces.IFilterManager{
|
public static CreateFilterManager(classSelectorManager:visualInterfaces.IFilterManagerConstructor,host:powerbi.extensibility.visual.IVisualHost):visualInterfaces.IFilterManager{
|
||||||
return new classSelectorManager(host);
|
return new classSelectorManager(host);
|
||||||
|
@ -1,75 +1,136 @@
|
|||||||
"Use strict";
|
"Use strict";
|
||||||
|
import "../../node_modules/bootstrap/dist/css/bootstrap.css";
|
||||||
|
import "../../node_modules/bootstrap-multiselect/dist/css/bootstrap-multiselect.css";
|
||||||
import powerbi from "powerbi-visuals-api";
|
import powerbi from "powerbi-visuals-api";
|
||||||
import {ISelectorManager,ISelectorManagerConstructor} from "../visual/visualInterfaces";
|
import {ISelectorManager,ISelectorManagerConstructor, IFilterManager} from "../visual/visualInterfaces";
|
||||||
import * as d3 from "d3";
|
import * as d3 from "d3";
|
||||||
import * as settings from "../settings";
|
|
||||||
import * as selectors from "./selectors";
|
|
||||||
type Selection<T extends d3.BaseType> = d3.Selection<T, any, any, any>;
|
type Selection<T extends d3.BaseType> = d3.Selection<T, any, any, any>;
|
||||||
import {EventEmitter} from "events";
|
|
||||||
/*
|
/*
|
||||||
负责页面上选择器的展示
|
负责页面上选择器的展示
|
||||||
*/
|
*/
|
||||||
export class SelectorManager extends EventEmitter implements ISelectorManager {
|
export class SelectorManager implements ISelectorManager{
|
||||||
public selectorContainer : Selection<HTMLElement>;
|
public selectorContainer : Selection<HTMLElement>;
|
||||||
private selector:selectors.ISelector;
|
private selector:ISelector;
|
||||||
|
public filterManager:IFilterManager;
|
||||||
private field: powerbi.DataViewCategoryColumn;
|
private categories: powerbi.DataViewCategoryColumn;
|
||||||
private defaultSelect: powerbi.DataViewValueColumn;
|
private defaultSelect: powerbi.DataViewValueColumn;
|
||||||
private defaultStart: powerbi.DataViewValueColumn;
|
private defaultStart: powerbi.DataViewValueColumn;
|
||||||
private defaultEnd: powerbi.DataViewValueColumn;
|
private defaultEnd: powerbi.DataViewValueColumn;
|
||||||
|
constructor(selectorContainer:Selection<HTMLElement>,filterManager:IFilterManager){
|
||||||
//events
|
|
||||||
public stringFieldFilter_event: string="stringFieldFilter_event";
|
|
||||||
|
|
||||||
constructor(selectorContainer:Selection<HTMLElement>){
|
|
||||||
super();
|
|
||||||
console.debug("selectorManager constructor start");
|
console.debug("selectorManager constructor start");
|
||||||
this.selectorContainer=selectorContainer;
|
this.selectorContainer=selectorContainer;
|
||||||
|
this.filterManager=filterManager;
|
||||||
}
|
}
|
||||||
select(items: string[]): void {
|
public switchSelector<T extends ISelector>(classSelector:new ()=>T){
|
||||||
this.selector.select(items);
|
|
||||||
}
|
|
||||||
|
|
||||||
updateFormat(visualSettings:settings.VisualSettings,width:number,height:number): void {
|
|
||||||
console.debug('selectorManager updateFormat start');
|
|
||||||
console.debug('visualSettings:',visualSettings);
|
|
||||||
if(visualSettings&&visualSettings.items){
|
|
||||||
this.selector.updateFormat(visualSettings.items,width,height);
|
|
||||||
}
|
|
||||||
|
|
||||||
console.debug('selectorManager updateFormat end');
|
|
||||||
|
|
||||||
}
|
|
||||||
public dispose():void{
|
|
||||||
this.selector.dispose();
|
|
||||||
this.selectorContainer.remove();
|
|
||||||
}
|
|
||||||
public switchSelector<T extends selectors.ISelector>(classSelector:new ()=>T){
|
|
||||||
let newSelector=new classSelector();
|
let newSelector=new classSelector();
|
||||||
this.selector?.dispose();
|
this.selector?.dispose();
|
||||||
this.selector=newSelector;
|
this.selector=newSelector;
|
||||||
}
|
}
|
||||||
updateData(field: powerbi.DataViewCategoryColumn, defaultSelect: powerbi.DataViewValueColumn, defaultStart: powerbi.DataViewValueColumn, defaultEnd: powerbi.DataViewValueColumn){
|
updateData(categories: powerbi.DataViewCategoryColumn, defaultSelect: powerbi.DataViewValueColumn, defaultStart: powerbi.DataViewValueColumn, defaultEnd: powerbi.DataViewValueColumn){
|
||||||
|
|
||||||
|
|
||||||
if(!this.selector){
|
if(!this.selector){
|
||||||
let fieldType=field.source.type;
|
let fieldType=categories.source.type;
|
||||||
if(fieldType.text){
|
if(fieldType.text){
|
||||||
let dropDownSelectorContainer=this.selectorContainer.append("div").classed("dropDown-selector-container",true);
|
this.selector=new DropDownSelector(this);
|
||||||
this.selector=new selectors.DropDownSelector(dropDownSelectorContainer);
|
|
||||||
}else if(fieldType.numeric){
|
}else if(fieldType.numeric){
|
||||||
let dropDownSelectorContainer=this.selectorContainer.append("div").classed("dropDown-selector-container",true);
|
this.selector=new DropDownSelector(this);
|
||||||
this.selector=new selectors.DropDownSelector(dropDownSelectorContainer);
|
|
||||||
}else if(fieldType.dateTime){
|
}else if(fieldType.dateTime){
|
||||||
let dropDownSelectorContainer=this.selectorContainer.append("div").classed("dropDown-selector-container",true);
|
this.selector=new CalendarSelector(this);
|
||||||
this.selector=new selectors.DropDownSelector(dropDownSelectorContainer);
|
|
||||||
}else{
|
}else{
|
||||||
throw "only receive text/num/datetime field";
|
throw "only receive text/num/datetime field";
|
||||||
}
|
}
|
||||||
this.selector.on(this.selector.stringFieldFilter_event,(selectionValues:string[],applyNow:boolean)=>{
|
|
||||||
this.emit(this.stringFieldFilter_event,selectionValues,applyNow);
|
|
||||||
});
|
|
||||||
console.debug('selector stringFieldFilter registered');
|
|
||||||
}
|
}
|
||||||
this.selector.update(field, defaultSelect, defaultStart, defaultEnd);
|
|
||||||
|
|
||||||
|
this.selector.update(categories, defaultSelect, defaultStart, defaultEnd);
|
||||||
|
};
|
||||||
|
public filterStringField(selection:string[]){
|
||||||
|
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
|
interface ISelector{
|
||||||
|
update(categories: powerbi.DataViewCategoryColumn, defaultSelect: powerbi.DataViewValueColumn, defaultStart: powerbi.DataViewValueColumn, defaultEnd: powerbi.DataViewValueColumn);
|
||||||
|
dispose():void;
|
||||||
|
}
|
||||||
|
|
||||||
|
abstract class Selector implements ISelector{
|
||||||
|
constructor(manager: ISelectorManager){
|
||||||
|
console.debug("Abstract selector:","constructor start");
|
||||||
|
this.manager=manager;
|
||||||
|
this.createView();
|
||||||
|
}
|
||||||
|
protected abstract createView():void;
|
||||||
|
public abstract dispose():void;
|
||||||
|
protected readonly manager:ISelectorManager;
|
||||||
|
public abstract update(categories: powerbi.DataViewCategoryColumn, defaultSelect: powerbi.DataViewValueColumn, defaultStart: powerbi.DataViewValueColumn, defaultEnd: powerbi.DataViewValueColumn):void;
|
||||||
|
}
|
||||||
|
class DropDownSelector extends Selector{
|
||||||
|
private dropDown:Selection<HTMLElement>;
|
||||||
|
protected createView() {
|
||||||
|
console.debug('dropDownViewManager','createView start');
|
||||||
|
|
||||||
|
this.dropDown=this.manager.selectorContainer.append('div').classed('dropDown-selector',true)
|
||||||
|
.append('select').attr('id','dropDown-select').attr('multiple','true');
|
||||||
|
console.debug('dropDownViewManager','createView end');
|
||||||
|
}
|
||||||
|
public dispose(){
|
||||||
|
this.dropDown.remove();
|
||||||
|
}
|
||||||
|
public update(field: powerbi.DataViewCategoryColumn, defaultSelect: powerbi.DataViewValueColumn, defaultStart: powerbi.DataViewValueColumn, defaultEnd: powerbi.DataViewValueColumn) {
|
||||||
|
console.debug('dropDownViewManager','update start');
|
||||||
|
let filterManager:IFilterManager=this.manager.filterManager;
|
||||||
|
|
||||||
|
$('#dropDown-select').multiselect({
|
||||||
|
onChange:function(){
|
||||||
|
let selectedValues:string[]=[];
|
||||||
|
$('option:selected').map(function(a,item){
|
||||||
|
selectedValues.push(item.textContent);
|
||||||
|
console.debug('item:',item.textContent);
|
||||||
|
filterManager.filterStringField(selectedValues);
|
||||||
|
});
|
||||||
|
},
|
||||||
|
maxHeight:200,
|
||||||
|
includeSelectAllOption:true
|
||||||
|
});
|
||||||
|
let options=[];
|
||||||
|
field.values.map((item)=>{
|
||||||
|
options.push({
|
||||||
|
label:item.toString()
|
||||||
|
});
|
||||||
|
});
|
||||||
|
$('#dropDown-select').multiselect('dataprovider',options);
|
||||||
|
$('.dropDown-selector').css('overflow','visible').css('z-index',1000).css('position','relative');
|
||||||
|
$('.dropdown-menu').css('overflow','flow').css('z-index',1000).css('position','relative');
|
||||||
|
//$('#dropDown-select').multiselect('rebuild');
|
||||||
|
|
||||||
|
console.debug("dropDown:",this.dropDown);
|
||||||
|
|
||||||
|
console.debug('dropDownViewManager','update end');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
class ListSelector extends Selector{
|
||||||
|
public dispose() {
|
||||||
|
throw new Error("Method not implemented.");
|
||||||
|
}
|
||||||
|
protected createView() {
|
||||||
|
throw new Error("Method not implemented.");
|
||||||
|
}
|
||||||
|
public update(categories: powerbi.DataViewCategoryColumn, defaultSelect: powerbi.DataViewValueColumn, defaultStart: powerbi.DataViewValueColumn, defaultEnd: powerbi.DataViewValueColumn) {
|
||||||
|
console.debug('ListSelector','updateView');
|
||||||
|
let dropDownSelector=this.manager.selectorContainer.append("select").classed("listSelector");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
class CalendarSelector extends Selector{
|
||||||
|
public dispose() {
|
||||||
|
throw new Error("Method not implemented.");
|
||||||
|
}
|
||||||
|
protected createView() {
|
||||||
|
throw new Error("Method not implemented.");
|
||||||
|
}
|
||||||
|
public update(categories: powerbi.DataViewCategoryColumn, defaultSelect: powerbi.DataViewValueColumn, defaultStart: powerbi.DataViewValueColumn, defaultEnd: powerbi.DataViewValueColumn) {
|
||||||
|
console.debug('calendarViewManager','updateView');
|
||||||
|
let dropDownSelector=this.manager.selectorContainer.append("select").classed("listSelector");
|
||||||
|
}
|
||||||
|
}
|
3
src/managers/selectors.ts/index.ts
Normal file
3
src/managers/selectors.ts/index.ts
Normal file
@ -0,0 +1,3 @@
|
|||||||
|
/*
|
||||||
|
In the future, move all selectors here.
|
||||||
|
*/
|
@ -1,168 +0,0 @@
|
|||||||
import { Selector } from "./selector";
|
|
||||||
import * as settings from "../../settings";
|
|
||||||
import powerbi from "powerbi-visuals-api";
|
|
||||||
import * as d3 from "d3";
|
|
||||||
import { selection } from "d3";
|
|
||||||
type Selection<T extends d3.BaseType> = d3.Selection<T, any, any, any>;
|
|
||||||
import {pixelConverter} from "powerbi-visuals-utils-typeutils";
|
|
||||||
|
|
||||||
export class DropDownSelector extends Selector {
|
|
||||||
public select(items: string[]): void {
|
|
||||||
console.debug('dropDownSelector select items:',items);
|
|
||||||
this.dropDown.selectAll('option').each(function(d,i){
|
|
||||||
console.debug('this.text:',d3.select(this).text());
|
|
||||||
if(items.includes(d3.select(this).text())){
|
|
||||||
console.debug('dropDownSelector select, included this:',this);
|
|
||||||
d3.select(this).attr('selected','selected');
|
|
||||||
}else{
|
|
||||||
console.debug('dropDownSelector select, not included this:',this);
|
|
||||||
d3.select(this).attr('selected',null);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
public updateFormat(itemsSetting: settings.ItemsSetting, width: number, height: number) {
|
|
||||||
console.debug('dropDownSelector updateFormat start');
|
|
||||||
if (itemsSetting) {
|
|
||||||
this.dropDown.style('background-color', itemsSetting.backgroundColor)
|
|
||||||
.attr('postion','absolute')
|
|
||||||
.style('color', itemsSetting.fontColor)
|
|
||||||
.style('font-size',pixelConverter.fromPointToPixel(itemsSetting.textSize) + 'px')
|
|
||||||
.style('width', (width - 10) + 'px')
|
|
||||||
.style('border-style', settings.Enums.getOutlineStyle(itemsSetting.outline))
|
|
||||||
.style('border-width', '2px')
|
|
||||||
.style('border-color', 'black');
|
|
||||||
this.dropDown.selectAll('option').style('background-color', itemsSetting.backgroundColor)
|
|
||||||
.style('color', itemsSetting.fontColor)
|
|
||||||
.style('font-size', pixelConverter.fromPointToPixel(itemsSetting.textSize) + 'px')
|
|
||||||
.style('border-style', settings.Enums.getOutlineStyle(itemsSetting.outline))
|
|
||||||
.style('border-width', '2px')
|
|
||||||
.style('border-color', 'black');
|
|
||||||
}
|
|
||||||
console.debug('dropDownSelector updateFormat end');
|
|
||||||
}
|
|
||||||
protected checkDefaultSelectionChange(defaultSelect: powerbi.DataViewValueColumn, defaultStart: powerbi.DataViewValueColumn, defaultEnd: powerbi.DataViewValueColumn): boolean {
|
|
||||||
//The defaultSelect is nullable, so first check the new defaultSelect
|
|
||||||
console.debug('checkDefaultSelectionChange start');
|
|
||||||
let flag: boolean;
|
|
||||||
if (!defaultSelect || !defaultSelect.values || !defaultSelect.values[0]) {
|
|
||||||
console.debug('new defaultSelect is null, set flag=false')
|
|
||||||
flag = flag || false;
|
|
||||||
} else {
|
|
||||||
console.debug('new defaultSelect is not null, check the oldDefaultSelect');
|
|
||||||
console.debug('new defaultSelect:', defaultSelect);
|
|
||||||
if (!this.defaultSelect || !this.defaultSelect.values || !defaultSelect.values[0]) {
|
|
||||||
console.debug('previous defaultSelect is null, set flag=true');
|
|
||||||
flag = flag || true;
|
|
||||||
} else {
|
|
||||||
if (defaultSelect.values[0].toString() != this.defaultSelect.values[0].toString()) {
|
|
||||||
console.debug('new defaultSelect not equal to the previous, set flag=true');
|
|
||||||
flag = flag || true;
|
|
||||||
} else {
|
|
||||||
console.debug('new defaultSelect equal to the previous, set flag=false');
|
|
||||||
flag = flag || false;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
console.debug('checkDefaultSelectionChange end, result:', flag);
|
|
||||||
return flag;
|
|
||||||
}
|
|
||||||
private container: Selection<HTMLDivElement>;
|
|
||||||
private dropDown: Selection<HTMLSelectElement>;
|
|
||||||
protected createView(container: Selection<HTMLDivElement>) {
|
|
||||||
console.debug('dropDownViewManager', 'createView start');
|
|
||||||
this.container = container;
|
|
||||||
this.dropDown = this.container.append("select").classed("dropDown-selector", true).classed("selector", true);//.attr('multiple',true);
|
|
||||||
let dropDownSelector=this;
|
|
||||||
//on change, filter
|
|
||||||
this.dropDown.on("input change", function () {
|
|
||||||
console.debug('DropDownSelector:', "input change");
|
|
||||||
console.debug('this', this);
|
|
||||||
let selectedValues: string[] = [];
|
|
||||||
for (let i = 0; i < this.selectedOptions.length; i++) {
|
|
||||||
let option = this.selectedOptions.item(i);
|
|
||||||
if (option.selected) {
|
|
||||||
console.debug("option selected", option);
|
|
||||||
console.debug('option.text:', option.text);
|
|
||||||
selectedValues.push(option.text);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
if (selectedValues.length == 0) {
|
|
||||||
} else {
|
|
||||||
console.debug("selection", selectedValues);
|
|
||||||
dropDownSelector.emit(dropDownSelector.stringFieldFilter_event,selectedValues,true);
|
|
||||||
}
|
|
||||||
console.debug("this", this.selectedOptions);
|
|
||||||
});
|
|
||||||
|
|
||||||
console.debug('dropDownViewManager', 'createView end');
|
|
||||||
|
|
||||||
}
|
|
||||||
public dispose() {
|
|
||||||
console.debug('dropDown-selector disposing');
|
|
||||||
this.dropDown.remove();
|
|
||||||
console.debug('dropDown-selector disposed');
|
|
||||||
|
|
||||||
}
|
|
||||||
public update(field: powerbi.DataViewCategoryColumn, defaultSelect: powerbi.DataViewValueColumn, defaultStart: powerbi.DataViewValueColumn, defaultEnd: powerbi.DataViewValueColumn) {
|
|
||||||
console.debug('dropDownViewManager', 'update start');
|
|
||||||
//Check field, defaultSelect are changed or not
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
let needUpdateDefaultSelection: boolean = this.checkFieldAndDefaultSelectionChange(field, defaultSelect, defaultStart, defaultEnd);
|
|
||||||
let newDefaultSelect: string;
|
|
||||||
if (needUpdateDefaultSelection && defaultSelect && defaultSelect.values && defaultSelect.values[0]) {
|
|
||||||
newDefaultSelect = defaultSelect.values[0].toString();
|
|
||||||
console.debug('newDefaultSelect:', newDefaultSelect);
|
|
||||||
}
|
|
||||||
//let values=field.values
|
|
||||||
let options: d3.Selection<HTMLOptionElement, powerbi.PrimitiveValue, HTMLSelectElement, any> = <d3.Selection<HTMLOptionElement, powerbi.PrimitiveValue, HTMLSelectElement, any>>this.dropDown.selectAll("option").data(field.values, function (d) { return d.toString(); });//map data
|
|
||||||
options.exit().remove();//delete
|
|
||||||
|
|
||||||
if (needUpdateDefaultSelection && newDefaultSelect) {
|
|
||||||
console.debug('reset defaultSelection start');
|
|
||||||
options = options.enter().append("option")
|
|
||||||
.text(function (d) { return d.toString(); })
|
|
||||||
.attr('label', function (d) { return d.toString(); })
|
|
||||||
.classed('dropDown-option', true)
|
|
||||||
.attr('title',function (d) { return d.toString(); })
|
|
||||||
.merge(options)
|
|
||||||
.attr("selected", function (d) {
|
|
||||||
console.debug('d.toString():', d.toString());
|
|
||||||
console.debug('newDefaultSelect:', newDefaultSelect);
|
|
||||||
return (d.toString() == newDefaultSelect) ? 'selected' : null;
|
|
||||||
});
|
|
||||||
console.debug('Set defaultSelection end');
|
|
||||||
} else {
|
|
||||||
console.debug('defaultSelection not reset, start update options');
|
|
||||||
options=options.enter().append("option")
|
|
||||||
.text(function (d) { return d.toString(); })
|
|
||||||
.attr('label', function (d) { return d.toString(); })
|
|
||||||
.attr('title',function (d) { return d.toString(); })
|
|
||||||
.attr('label', function (d) { return d.toString(); }).classed('dropDown-option', true).merge(options);//add
|
|
||||||
console.debug('defaultSelection not reset, end update options');
|
|
||||||
}
|
|
||||||
|
|
||||||
let selectedValues: string[] = [];
|
|
||||||
this.dropDown.selectAll('option').each(function(d,i){
|
|
||||||
let option=d3.select(this);
|
|
||||||
console.debug('option',option.text());
|
|
||||||
console.debug('selected?',option.property('selected'));
|
|
||||||
if(option.property('selected')){
|
|
||||||
console.debug('find a selected option:',option.text());
|
|
||||||
selectedValues.push(option.text());
|
|
||||||
}
|
|
||||||
});
|
|
||||||
if (selectedValues.length == 0) {
|
|
||||||
} else {
|
|
||||||
console.debug("selection", selectedValues);
|
|
||||||
}
|
|
||||||
this.emit(this.stringFieldFilter_event,selectedValues,false);
|
|
||||||
console.debug("dropDown:", this.dropDown);
|
|
||||||
this.field = field;
|
|
||||||
this.defaultSelect = defaultSelect;
|
|
||||||
console.debug('new defaultSelect:', defaultSelect);
|
|
||||||
console.debug('this.defaultSelect=defaultSelect, this.defaultSelect:', this.defaultSelect);
|
|
||||||
console.debug('dropDownViewManager', 'update end');
|
|
||||||
}
|
|
||||||
}
|
|
@ -1,5 +0,0 @@
|
|||||||
/*
|
|
||||||
In the future, move all selectors here.
|
|
||||||
*/
|
|
||||||
export {ISelector,Selector} from "./selector";
|
|
||||||
export {DropDownSelector} from "./dropDownSelector";
|
|
@ -1,52 +0,0 @@
|
|||||||
import powerbi from "powerbi-visuals-api";
|
|
||||||
import * as settings from "../../settings";
|
|
||||||
import * as d3 from "d3";
|
|
||||||
import { EventEmitter } from "events";
|
|
||||||
type Selection<T extends d3.BaseType> = d3.Selection<T, any, any, any>;
|
|
||||||
export interface ISelector extends EventEmitter{
|
|
||||||
update(field: powerbi.DataViewCategoryColumn, defaultSelect: powerbi.DataViewValueColumn, defaultStart: powerbi.DataViewValueColumn, defaultEnd: powerbi.DataViewValueColumn):void;
|
|
||||||
dispose():void;
|
|
||||||
select(items:string[]):void;
|
|
||||||
updateFormat(itemsSetting:settings.ItemsSetting,width:number,height:number):void;
|
|
||||||
stringFieldFilter_event:string;//filter a string field, give one param: string[]
|
|
||||||
}
|
|
||||||
|
|
||||||
export abstract class Selector extends EventEmitter implements ISelector{
|
|
||||||
protected field: powerbi.DataViewCategoryColumn;
|
|
||||||
protected defaultSelect: powerbi.DataViewValueColumn;
|
|
||||||
protected defaultStart: powerbi.DataViewValueColumn;
|
|
||||||
protected defaultEnd: powerbi.DataViewValueColumn;
|
|
||||||
//events
|
|
||||||
public stringFieldFilter_event:string="stringFieldFilter_event";
|
|
||||||
|
|
||||||
protected checkFieldChange(field: powerbi.DataViewCategoryColumn):boolean{
|
|
||||||
//Field is not null, so first check the old field
|
|
||||||
if(!this.field){
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
if(field.source.queryName==this.field.source.queryName){
|
|
||||||
console.debug('checkFieldChange: false');
|
|
||||||
return false;
|
|
||||||
}else{
|
|
||||||
console.debug('checkFieldChange: true');
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
protected abstract checkDefaultSelectionChange(defaultSelect: powerbi.DataViewValueColumn, defaultStart: powerbi.DataViewValueColumn, defaultEnd: powerbi.DataViewValueColumn):boolean;
|
|
||||||
protected checkFieldAndDefaultSelectionChange(field: powerbi.DataViewCategoryColumn, defaultSelect: powerbi.DataViewValueColumn, defaultStart: powerbi.DataViewValueColumn, defaultEnd: powerbi.DataViewValueColumn){
|
|
||||||
console.debug('checkFieldAndDefaultSelectionChange start');
|
|
||||||
let flag:boolean=this.checkFieldChange(field)||this.checkDefaultSelectionChange(defaultSelect,defaultStart,defaultEnd)
|
|
||||||
console.debug('checkFieldAndDefaultSelectionChange end, result:',flag);
|
|
||||||
return flag;
|
|
||||||
}
|
|
||||||
constructor(container:Selection<HTMLDivElement>){
|
|
||||||
super();
|
|
||||||
console.debug("Abstract selector:","constructor start");
|
|
||||||
this.createView(container);
|
|
||||||
}
|
|
||||||
public abstract select(items: string[]):void;
|
|
||||||
public abstract updateFormat(itemsSetting: settings.ItemsSetting,width:number,height:number):void;
|
|
||||||
protected abstract createView(container:Selection<HTMLDivElement>):void;
|
|
||||||
public abstract dispose():void;
|
|
||||||
public abstract update(field: powerbi.DataViewCategoryColumn, defaultSelect: powerbi.DataViewValueColumn, defaultStart: powerbi.DataViewValueColumn, defaultEnd: powerbi.DataViewValueColumn):void;
|
|
||||||
}
|
|
@ -1 +0,0 @@
|
|||||||
export {Outline,getOutlineStyle} from "./outline";
|
|
@ -1,38 +0,0 @@
|
|||||||
"Use strict";
|
|
||||||
export enum Outline {
|
|
||||||
None, BottomOnly, TopOnly, LeftOnly, RightOnly, TopAndBottom, LeftAndRight, Frame
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
export function getOutlineStyle(outline: Outline): string {
|
|
||||||
let outlineStyle: string;
|
|
||||||
switch (outline) {
|
|
||||||
case Outline.None:
|
|
||||||
outlineStyle = 'none';
|
|
||||||
break;
|
|
||||||
case Outline.BottomOnly:
|
|
||||||
outlineStyle = 'none none solid none';
|
|
||||||
break;
|
|
||||||
case Outline.TopOnly:
|
|
||||||
outlineStyle = 'solid none none none';
|
|
||||||
break;
|
|
||||||
case Outline.LeftOnly:
|
|
||||||
outlineStyle = 'none none none solid';
|
|
||||||
break;
|
|
||||||
case Outline.RightOnly:
|
|
||||||
outlineStyle = 'none solid none none';
|
|
||||||
break;
|
|
||||||
case Outline.TopAndBottom:
|
|
||||||
outlineStyle = 'solid none';
|
|
||||||
break;
|
|
||||||
case Outline.LeftAndRight:
|
|
||||||
outlineStyle = 'none solid';
|
|
||||||
break;
|
|
||||||
case Outline.Frame:
|
|
||||||
outlineStyle = 'solid';
|
|
||||||
break;
|
|
||||||
default:
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
return outlineStyle;
|
|
||||||
}
|
|
@ -1,4 +0,0 @@
|
|||||||
export {ItemsSetting} from "./itemsSetting";
|
|
||||||
export {SlicerHeaderSetting} from "./slicerHeaderSetting";
|
|
||||||
export {VisualSettings} from "./visualSettings";
|
|
||||||
export * as Enums from "./enums";
|
|
@ -1,8 +0,0 @@
|
|||||||
"Use strict";
|
|
||||||
import * as enums from "./enums"
|
|
||||||
export class ItemsSetting{
|
|
||||||
public fontColor:string="black";
|
|
||||||
public backgroundColor:string='transparent';
|
|
||||||
public outline:enums.Outline=enums.Outline.None;
|
|
||||||
public textSize:number=10;
|
|
||||||
}
|
|
@ -1,11 +0,0 @@
|
|||||||
"Use strict";
|
|
||||||
|
|
||||||
import * as enums from "./enums";
|
|
||||||
|
|
||||||
export class SlicerHeaderSetting{
|
|
||||||
public fontColor:string='';
|
|
||||||
public backgroundColor:string='';
|
|
||||||
public outline:enums.Outline=enums.Outline.None;
|
|
||||||
public outlineWeight:number=2;
|
|
||||||
public outlineColor:string="gray";
|
|
||||||
}
|
|
@ -28,11 +28,21 @@
|
|||||||
|
|
||||||
import { dataViewObjectsParser } from "powerbi-visuals-utils-dataviewutils";
|
import { dataViewObjectsParser } from "powerbi-visuals-utils-dataviewutils";
|
||||||
import DataViewObjectsParser = dataViewObjectsParser.DataViewObjectsParser;
|
import DataViewObjectsParser = dataViewObjectsParser.DataViewObjectsParser;
|
||||||
import {SlicerHeaderSetting} from "./slicerHeaderSetting";
|
|
||||||
import {ItemsSetting} from "./itemsSetting";
|
|
||||||
export class VisualSettings extends DataViewObjectsParser {
|
export class VisualSettings extends DataViewObjectsParser {
|
||||||
public items: ItemsSetting = new ItemsSetting();
|
public dataPoint: dataPointSettings = new dataPointSettings();
|
||||||
public slicerHeader:SlicerHeaderSetting=new SlicerHeaderSetting();
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export class dataPointSettings {
|
||||||
|
// Default color
|
||||||
|
public defaultColor: string = "";
|
||||||
|
// Show all
|
||||||
|
public showAllDataPoints: boolean = true;
|
||||||
|
// Fill
|
||||||
|
public fill: string = "";
|
||||||
|
// Color saturation
|
||||||
|
public fillRule: string = "";
|
||||||
|
// Text Size
|
||||||
|
public fontSize: number = 12;
|
||||||
|
}
|
||||||
|
|
||||||
|
@ -36,7 +36,6 @@ import VisualObjectInstance = powerbi.VisualObjectInstance;
|
|||||||
import DataView = powerbi.DataView;
|
import DataView = powerbi.DataView;
|
||||||
import VisualObjectInstanceEnumerationObject = powerbi.VisualObjectInstanceEnumerationObject;
|
import VisualObjectInstanceEnumerationObject = powerbi.VisualObjectInstanceEnumerationObject;
|
||||||
import IVisualEventService = powerbi.extensibility.IVisualEventService;
|
import IVisualEventService = powerbi.extensibility.IVisualEventService;
|
||||||
import SelectionManager=powerbi.extensibility.ISelectionManager;
|
|
||||||
import * as visualInterfaces from "./visualInterfaces";
|
import * as visualInterfaces from "./visualInterfaces";
|
||||||
import IVisualHost = powerbi.extensibility.visual.IVisualHost;
|
import IVisualHost = powerbi.extensibility.visual.IVisualHost;
|
||||||
import { VisualSettings } from "../settings/visualSettings";
|
import { VisualSettings } from "../settings/visualSettings";
|
||||||
@ -44,10 +43,8 @@ import {FilterManager,ManagerFactory,SelectorManager,LayoutManager} from "../man
|
|||||||
import * as d3 from "d3";
|
import * as d3 from "d3";
|
||||||
import { getObject } from "powerbi-visuals-utils-dataviewutils/lib/dataViewObjects";
|
import { getObject } from "powerbi-visuals-utils-dataviewutils/lib/dataViewObjects";
|
||||||
import { getMeasureIndexOfRole } from "powerbi-visuals-utils-dataviewutils/lib/dataRoleHelper";
|
import { getMeasureIndexOfRole } from "powerbi-visuals-utils-dataviewutils/lib/dataRoleHelper";
|
||||||
import { selector, json } from "d3";
|
import { selector } from "d3";
|
||||||
import { debuglog } from "util";
|
|
||||||
import { EventEmitter } from "events";
|
|
||||||
import * as models from 'powerbi-models';
|
|
||||||
export class Visual implements IVisual {
|
export class Visual implements IVisual {
|
||||||
/*
|
/*
|
||||||
SelectorManager: a custom manager, used to manage dropDownSelector, listSelector, calendarSelector, and so on
|
SelectorManager: a custom manager, used to manage dropDownSelector, listSelector, calendarSelector, and so on
|
||||||
@ -55,63 +52,41 @@ export class Visual implements IVisual {
|
|||||||
*/
|
*/
|
||||||
private events: IVisualEventService;
|
private events: IVisualEventService;
|
||||||
private settings: VisualSettings;
|
private settings: VisualSettings;
|
||||||
private selectionManager:SelectionManager;
|
|
||||||
private layoutManager: visualInterfaces.ILayoutManager;
|
private layoutManager: visualInterfaces.ILayoutManager;
|
||||||
private selectorManager: visualInterfaces.ISelectorManager&EventEmitter;
|
private selectorManager: visualInterfaces.ISelectorManager;
|
||||||
|
private view:SVGElement;
|
||||||
private filterManager:visualInterfaces.IFilterManager;
|
private filterManager:visualInterfaces.IFilterManager;
|
||||||
private readonly id:number;
|
private selectionManager:powerbi.extensibility.ISelectionManager;
|
||||||
private isFirstUpdate:boolean=true;
|
|
||||||
//private selectionManager:powerbi.extensibility.ISelectionManager;
|
|
||||||
constructor(options: VisualConstructorOptions) {
|
constructor(options: VisualConstructorOptions) {
|
||||||
console.debug('Visual constructor start');
|
console.debug('Visual constructor', options);
|
||||||
console.debug('options:',options);
|
|
||||||
this.events = options.host.eventService;
|
this.events = options.host.eventService;
|
||||||
if (document) {
|
if (document) {
|
||||||
//this.selectionManager =options.host.createSelectionManager();
|
this.selectionManager =options.host.createSelectionManager();
|
||||||
let container=d3.select(options.element).append("div").classed("container",true);
|
let container=d3.select(options.element).append("div").classed("container",true);
|
||||||
|
// d3.select(options.element).on('contextmenu', () => {
|
||||||
//overload context menu
|
// const mouseEvent: MouseEvent = <MouseEvent>d3.event;
|
||||||
let coverContextMenu=false;
|
// //const eventTarget: EventTarget = mouseEvent.target;
|
||||||
if(coverContextMenu){
|
// //let dataPoint = d3.select(eventTarget).datum();
|
||||||
d3.select(options.element).on('contextmenu', () => {
|
// this.selectionManager.showContextMenu({}, {
|
||||||
const mouseEvent: MouseEvent = <MouseEvent>d3.event;
|
// x: mouseEvent.clientX,
|
||||||
//const eventTarget: EventTarget = mouseEvent.target;
|
// y: mouseEvent.clientY
|
||||||
//let dataPoint = d3.select(eventTarget).datum();
|
// });
|
||||||
this.selectionManager.showContextMenu({}, {
|
// //mouseEvent.preventDefault();
|
||||||
x: mouseEvent.clientX,
|
// });
|
||||||
y: mouseEvent.clientY
|
let headerContainer=container.append("div").classed("header-container",true);
|
||||||
});
|
let selectorContainer=container.append("div").classed("selector-container",true);
|
||||||
//mouseEvent.preventDefault();
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
//First, create the filterManager
|
//First, create the filterManager
|
||||||
this.filterManager=ManagerFactory.CreateFilterManager(FilterManager,options.host);
|
this.filterManager=ManagerFactory.CreateFilterManager(FilterManager,options.host);
|
||||||
//Then, layoutManager and selectorManager, both use the filterManager
|
//Then, layoutManager and selectorManager
|
||||||
//Lagyoutmanager manage the whole div and the slicer-header
|
|
||||||
this.layoutManager=ManagerFactory.CreateLayoutManager(LayoutManager,container,this.filterManager);
|
this.layoutManager=ManagerFactory.CreateLayoutManager(LayoutManager,container,this.filterManager);
|
||||||
//SelectorManager manage selectors
|
this.selectorManager=ManagerFactory.CreateSelectorManager(SelectorManager,selectorContainer,this.filterManager);
|
||||||
let selectorContainer=container.append("div").classed("selector-container",true);
|
|
||||||
this.selectorManager=ManagerFactory.CreateSelectorManager(SelectorManager,selectorContainer);
|
|
||||||
|
|
||||||
//events
|
|
||||||
this.selectorManager.on(this.selectorManager.stringFieldFilter_event,(selectionValues:string[],applyNow:boolean)=>{
|
|
||||||
this.filterManager.setFilter_String(selectionValues,applyNow);
|
|
||||||
});
|
|
||||||
console.debug('selectorManager stringFieldFilter_event registered');
|
|
||||||
//set id
|
|
||||||
this.id=Math.random();
|
|
||||||
}
|
}
|
||||||
console.debug('end constructor');
|
console.debug('end constructor');
|
||||||
}
|
}
|
||||||
|
|
||||||
public update(options: VisualUpdateOptions) {
|
public update(options: VisualUpdateOptions) {
|
||||||
console.debug('visual update start');
|
console.debug('visual update start');
|
||||||
console.debug('id:',this.id);
|
|
||||||
console.debug('options:',options);
|
|
||||||
//console.debug('operationKind',options.operationKind.toString());
|
|
||||||
this.events.renderingStarted(options);
|
this.events.renderingStarted(options);
|
||||||
this.filterManager.inAdvancedEditMode=options.editMode==powerbi.EditMode.Advanced
|
|
||||||
this.settings = Visual.parseSettings(options && options.dataViews && options.dataViews[0]);
|
this.settings = Visual.parseSettings(options && options.dataViews && options.dataViews[0]);
|
||||||
let dataView=options.dataViews[0];
|
let dataView=options.dataViews[0];
|
||||||
let field=dataView.categorical.categories[0];
|
let field=dataView.categorical.categories[0];
|
||||||
@ -135,60 +110,16 @@ export class Visual implements IVisual {
|
|||||||
let height:number=options.viewport.height;
|
let height:number=options.viewport.height;
|
||||||
|
|
||||||
console.debug("start layoutManager updateView");
|
console.debug("start layoutManager updateView");
|
||||||
this.layoutManager.update(dataView,width,height);
|
this.layoutManager.update(dataView,width-10,height-10);
|
||||||
|
|
||||||
|
console.debug("start selectorManager updateView");
|
||||||
|
this.selectorManager.updateData(field,defaultSelect,defaultStart,defaultEnd);
|
||||||
|
|
||||||
console.debug("start filterManager updateView");
|
console.debug("start filterManager updateView");
|
||||||
this.filterManager.update(field);
|
this.filterManager.update(field);
|
||||||
|
|
||||||
console.debug("start selectorManager update");
|
|
||||||
this.selectorManager.updateData(field,defaultSelect,defaultStart,defaultEnd);
|
|
||||||
this.selectorManager.updateFormat(this.settings,width,height);
|
|
||||||
console.debug("previous filter",JSON.stringify(options.jsonFilters));
|
|
||||||
/*
|
|
||||||
Compare two jsonFilters(filterManager.jsonFilter and options.jsonFilters[0]).
|
|
||||||
Use method JSON.stringify.
|
|
||||||
1. filterManager.jsonFilter is null, options.jsonFilter[0] is null
|
|
||||||
Don't restore
|
|
||||||
2. filterManager.jsonFilter is Null, options.jsonFilter[0] is not null
|
|
||||||
Restore
|
|
||||||
3. filterManager.jsonFilter is not null, options.jsonFilter[0] is null
|
|
||||||
Don't restore
|
|
||||||
4. filterManager.jsonFilter != options.jsonFilter[0]
|
|
||||||
Restore
|
|
||||||
5. filterManager.jsonFilter == options.jsonFilter[0]
|
|
||||||
Don't restore
|
|
||||||
*/
|
|
||||||
if(options.jsonFilters&&options.jsonFilters[0]&&this.isFirstUpdate){
|
|
||||||
console.debug('options.jsonFilters[0] is not null');
|
|
||||||
if((!this.filterManager.jsonFilter)||
|
|
||||||
(JSON.stringify(this.filterManager.jsonFilter)!=JSON.stringify(options.jsonFilters[0]))){
|
|
||||||
console.debug('Two filter are different');
|
|
||||||
let advancedFilter:models.IAdvancedFilter=options.jsonFilters[0] as models.IAdvancedFilter;
|
|
||||||
console.debug("Cast as advancedFilter:",advancedFilter);
|
|
||||||
if(advancedFilter.conditions[0].value=='SyinpoSlicer_AdvancedEditMode_true'){
|
|
||||||
console.debug('previous filter is created in AdvancedEditMode');
|
|
||||||
}else{
|
|
||||||
//Sync slicers
|
|
||||||
console.debug('Sync slicers init or restore a bookmark start');
|
|
||||||
this.filterManager.setFilter(advancedFilter,false);
|
|
||||||
let oldSelection:string[]=[];
|
|
||||||
advancedFilter.conditions.map(function(condition,index){
|
|
||||||
oldSelection.push(condition.value as string);
|
|
||||||
});
|
|
||||||
this.selectorManager.select(oldSelection);
|
|
||||||
console.debug('Sync slicers init or restore a bookmark end');
|
|
||||||
}
|
|
||||||
}else{
|
|
||||||
console.debug('Two filter are equal');
|
|
||||||
}//end if
|
|
||||||
}else{
|
|
||||||
console.debug('Neednt init a sync slicer or restore a bookmark');
|
|
||||||
}
|
|
||||||
console.debug('visual update end');
|
|
||||||
this.isFirstUpdate=false;
|
|
||||||
this.filterManager.applyJsonFilter();
|
|
||||||
this.events.renderingFinished(options);
|
this.events.renderingFinished(options);
|
||||||
}
|
}
|
||||||
|
|
||||||
private static parseSettings(dataView: DataView): VisualSettings {
|
private static parseSettings(dataView: DataView): VisualSettings {
|
||||||
return <VisualSettings>VisualSettings.parse(dataView);
|
return <VisualSettings>VisualSettings.parse(dataView);
|
||||||
}
|
}
|
||||||
|
@ -6,51 +6,36 @@ import {VisualSettings} from "../settings/visualSettings";
|
|||||||
import * as d3 from "d3";
|
import * as d3 from "d3";
|
||||||
import { IFilter } from "powerbi-models";
|
import { IFilter } from "powerbi-models";
|
||||||
type Selection<T extends d3.BaseType> = d3.Selection<T, any, any, any>;
|
type Selection<T extends d3.BaseType> = d3.Selection<T, any, any, any>;
|
||||||
import {EventEmitter} from "events";
|
|
||||||
import * as models from 'powerbi-models';
|
|
||||||
|
|
||||||
/*
|
/*
|
||||||
Main interfaces
|
Main interfaces
|
||||||
*/
|
*/
|
||||||
|
|
||||||
//IVisualSettings
|
|
||||||
|
|
||||||
|
|
||||||
//ISelectorManager
|
//ISelectorManager
|
||||||
export interface ILayoutManager{
|
export interface ILayoutManager{
|
||||||
layout:Selection<HTMLElement>;
|
layout:Selection<HTMLElement>;
|
||||||
update(dataView:DataView,width:number,height:number):void;
|
update(dataView:DataView,width:number,height:number):void;
|
||||||
dispose():void;
|
|
||||||
}
|
}
|
||||||
export interface ILayoutManagerConstructor{
|
export interface ILayoutManagerConstructor{
|
||||||
new(container:Selection<HTMLElement>,filterManager:IFilterManager):ILayoutManager;
|
new(container:Selection<HTMLElement>,filterManager:IFilterManager):ILayoutManager;
|
||||||
}
|
};
|
||||||
|
|
||||||
//ISelectorManager
|
//ISelectorManager
|
||||||
|
|
||||||
export interface ISelectorManager{
|
export interface ISelectorManager{
|
||||||
selectorContainer:Selection<HTMLElement>;
|
selectorContainer:Selection<HTMLElement>;
|
||||||
stringFieldFilter_event:string;//filter a string field, give one param: string[]
|
filterManager:IFilterManager;
|
||||||
dispose():void;
|
updateData(field:powerbi.DataViewCategoryColumn,defaultSelect:powerbi.DataViewValueColumn,defaultStart:powerbi.DataViewValueColumn,defaultEnd:powerbi.DataViewValueColumn);
|
||||||
updateData(field:powerbi.DataViewCategoryColumn,defaultSelect:powerbi.DataViewValueColumn,defaultStart:powerbi.DataViewValueColumn,defaultEnd:powerbi.DataViewValueColumn):void;
|
|
||||||
updateFormat(visualSettings:VisualSettings,width:number,height:number):void;
|
|
||||||
select(items:string[]):void;
|
|
||||||
|
|
||||||
}
|
}
|
||||||
export interface ISelectorManagerConstructor{
|
export interface ISelectorManagerConstructor{
|
||||||
new(selectorContainer:Selection<HTMLElement>):ISelectorManager&EventEmitter;
|
new(selectorContainer:Selection<HTMLElement>,filterManager:IFilterManager):ISelectorManager;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
//IFilterManager
|
//IFilterManager
|
||||||
export interface IFilterManager{
|
export interface IFilterManager{
|
||||||
jsonFilter:models.IAdvancedFilter;
|
|
||||||
inAdvancedEditMode:boolean;
|
|
||||||
update(field:powerbi.DataViewCategoryColumn):void;
|
update(field:powerbi.DataViewCategoryColumn):void;
|
||||||
setFilter_String(selection:string[],applyNow:boolean):void;
|
filterStringField(selection:string[]):void;
|
||||||
setFilter(jsonFilter:models.IAdvancedFilter,applyNow:boolean):void;
|
|
||||||
applyJsonFilter():void;
|
|
||||||
clear():void;
|
clear():void;
|
||||||
dispose():void;
|
|
||||||
}
|
}
|
||||||
export interface IFilterManagerConstructor{
|
export interface IFilterManagerConstructor{
|
||||||
new(host:IVisualHost):IFilterManager;
|
new(host:IVisualHost):IFilterManager;
|
||||||
|
@ -1,3 +1,5 @@
|
|||||||
|
@import "/node_modules/bootstrap/dist/css/bootstrap.min.css";
|
||||||
|
@import "/node_modules/bootstrap-multiselect/dist/css/bootstrap-multiselect.css";
|
||||||
p {
|
p {
|
||||||
font-size: 20px;
|
font-size: 20px;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
|
Loading…
Reference in New Issue
Block a user