Add tag for pictures

capabilities.json

@@ -1,12 +1,23 @@
 {
     "dataRoles": [{
-        "displayName": "urls",
+            "displayName": "urls",
-        "displayNameKey": "roles-urls-displayName",
+            "displayNameKey": "roles-urls-displayName",
-        "name": "urls",
+            "name": "urls",
-        "kind": "Grouping",
+            "kind": "Grouping",
-        "description": "Urls of pictures, example: 'http://www.example.com/xx.png'",
+            "requiredTypes": [{ "text": true }],
-        "descriptionKey": "roles-urls-description"
+            "description": "Urls of pictures, example: 'http://www.example.com/xx.png'",
-    }],
+            "descriptionKey": "roles-urls-description"
+        },
+        {
+            "displayName": "tags",
+            "displayNameKey": "roles-tags-displayName",
+            "name": "tags",
+            "kind": "Grouping",
+            "requiredTypes": [{ "text": true }],
+            "description": "text to be displayed with pictures",
+            "descriptionKey": "roles-tags-description"
+        }
+    ],
     "objects": {
         "layout": {
             "displayName": "layout",
@@ -30,7 +41,6 @@
                     "displayNameKey": "objects-layout-rowGap-displayName",
                     "description": "The distance moved during each cycle.(%)",
                     "descriptionKey": "objects-layout-rowGap-descriptionKey"
-
                 },
                 "columnGap": {
                     "type": {
@@ -56,7 +66,6 @@
                     "displayNameKey": "objects-animation-stepLength-displayName",
                     "description": "The distance moved during each cycle.(%)",
                     "descriptionKey": "objects-animation-stepLength-descriptionKey"
-
                 },
                 "interval": {
                     "type": {
@@ -67,7 +76,59 @@
                     "displayNameKey": "objects-animation-interval-displayName",
                     "description": "How long a cycle takes? (msec)",
                     "descriptionKey": "objects-animation-interval-descriptionKey"
-
+                }
+            }
+        },
+        "tag": {
+            "displayName": "tag",
+            "displayNameKey": "objects-tag-displayName",
+            "description": "text tag",
+            "descriptionKey": "objects-tag-description",
+            "properties": {
+                "show": {
+                    "type": {
+                        "bool": true
+                    },
+                    "displayName": "show",
+                    "displayNameKey": "objects-tag-show-displayName"
+                },
+                "textSize": {
+                    "type": {
+                        "numeric": true
+                    },
+                    "displayName": "textSize",
+                    "displayNameKey": "objects-tag-textSize-displayName"
+                },
+                "position": {
+                    "type": {
+                        "enumeration": [{
+                            "displayName": "above",
+                            "displayNameKey": "objects-tag-position-enumeration-above-displayName",
+                            "value": "above"
+                        }, {
+                            "displayName": "bottom",
+                            "displayNameKey": "objects-tag-position-enumeration-bottom-displayName",
+                            "value": "bottom"
+                        }]
+                    }
+                },
+                "fontColor": {
+                    "type": {
+                        "fill": {
+                            "solid": {
+                                "color": true
+                            }
+                        }
+                    },
+                    "displayName": "fontColor",
+                    "displayNameKey": "objects-tag-fontColor-displayName"
+                },
+                "transparency": {
+                    "type": {
+                        "numeric": true
+                    },
+                    "displayName": "transparency",
+                    "displayNameKey": "objects-tag-transparency-displayName"
                 }
             }
         }
@@ -76,14 +137,28 @@
         "conditions": [{
             "urls": {
                 "min": 1,
-                "max": 1
+                "max": 1,
+                "kind": "Grouping"
+            },
+            "tag": {
+                "min": 0,
+                "max": 1,
+                "kind": "Grouping"
             }
         }],
         "categorical": {
             "categories": {
-                "for": {
+                "select": [{
-                    "in": "urls"
+                        "bind": {
-                },
+                            "to": "urls"
+                        }
+                    },
+                    {
+                        "bind": {
+                            "to": "tags"
+                        }
+                    }
+                ],
                 "dataReductionAlgorithm": {
                     "top": {}
                 }

package-lock.json

@@ -286,6 +286,17 @@
       "resolved": "https://registry.npm.taobao.org/@types/geojson/download/@types/geojson-7946.0.7.tgz",
       "integrity": "sha1-yPpTK2CgBCIZzfFzyiGpde8GZq0="
     },
+    "ajv": {
+      "version": "6.12.5",
+      "resolved": "https://registry.npm.taobao.org/ajv/download/ajv-6.12.5.tgz?cache=0&sync_timestamp=1600012525826&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fajv%2Fdownload%2Fajv-6.12.5.tgz",
+      "integrity": "sha1-GbDouuj0duW6ZmMAOHd1+xoApNo=",
+      "requires": {
+        "fast-deep-equal": "^3.1.1",
+        "fast-json-stable-stringify": "^2.0.0",
+        "json-schema-traverse": "^0.4.1",
+        "uri-js": "^4.2.2"
+      }
+    },
     "ansi-styles": {
       "version": "3.2.1",
       "resolved": "https://registry.npm.taobao.org/ansi-styles/download/ansi-styles-3.2.1.tgz",
@@ -299,17 +310,52 @@
       "version": "1.0.10",
       "resolved": "https://registry.npm.taobao.org/argparse/download/argparse-1.0.10.tgz",
       "integrity": "sha1-vNZ5HqWuCXJeF+WtmIE0zUCz2RE=",
-      "dev": true,
       "requires": {
         "sprintf-js": "~1.0.2"
       }
     },
+    "asn1": {
+      "version": "0.2.4",
+      "resolved": "https://registry.npm.taobao.org/asn1/download/asn1-0.2.4.tgz",
+      "integrity": "sha1-jSR136tVO7M+d7VOWeiAu4ziMTY=",
+      "requires": {
+        "safer-buffer": "~2.1.0"
+      }
+    },
+    "assert-plus": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npm.taobao.org/assert-plus/download/assert-plus-1.0.0.tgz",
+      "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU="
+    },
+    "asynckit": {
+      "version": "0.4.0",
+      "resolved": "https://registry.npm.taobao.org/asynckit/download/asynckit-0.4.0.tgz",
+      "integrity": "sha1-x57Zf380y48robyXkLzDZkdLS3k="
+    },
+    "aws-sign2": {
+      "version": "0.7.0",
+      "resolved": "https://registry.npm.taobao.org/aws-sign2/download/aws-sign2-0.7.0.tgz",
+      "integrity": "sha1-tG6JCTSpWR8tL2+G1+ap8bP+dqg="
+    },
+    "aws4": {
+      "version": "1.10.1",
+      "resolved": "https://registry.npm.taobao.org/aws4/download/aws4-1.10.1.tgz?cache=0&sync_timestamp=1597238704875&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Faws4%2Fdownload%2Faws4-1.10.1.tgz",
+      "integrity": "sha1-4eguTz6Zniz9YbFhKA0WoRH4ZCg="
+    },
     "balanced-match": {
       "version": "1.0.0",
       "resolved": "https://registry.npm.taobao.org/balanced-match/download/balanced-match-1.0.0.tgz",
       "integrity": "sha1-ibTRmasr7kneFk6gK4nORi1xt2c=",
       "dev": true
     },
+    "bcrypt-pbkdf": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npm.taobao.org/bcrypt-pbkdf/download/bcrypt-pbkdf-1.0.2.tgz",
+      "integrity": "sha1-pDAdOJtqQ/m2f/PKEaP2Y342Dp4=",
+      "requires": {
+        "tweetnacl": "^0.14.3"
+      }
+    },
     "big.js": {
       "version": "5.2.2",
       "resolved": "https://registry.npm.taobao.org/big.js/download/big.js-5.2.2.tgz",
@@ -341,6 +387,11 @@
       "integrity": "sha1-Jw8HbFpywC9bZaR9+Uxf46J4iS8=",
       "dev": true
     },
+    "caseless": {
+      "version": "0.12.0",
+      "resolved": "https://registry.npm.taobao.org/caseless/download/caseless-0.12.0.tgz",
+      "integrity": "sha1-G2gcIf+EAzyCZUMJBolCDRhxUdw="
+    },
     "chalk": {
       "version": "2.4.2",
       "resolved": "https://registry.npm.taobao.org/chalk/download/chalk-2.4.2.tgz?cache=0&sync_timestamp=1591687076871&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fchalk%2Fdownload%2Fchalk-2.4.2.tgz",
@@ -367,6 +418,14 @@
       "integrity": "sha1-p9BVi9icQveV3UIyj3QIMcpTvCU=",
       "dev": true
     },
+    "combined-stream": {
+      "version": "1.0.8",
+      "resolved": "https://registry.npm.taobao.org/combined-stream/download/combined-stream-1.0.8.tgz",
+      "integrity": "sha1-w9RaizT9cwYxoRCoolIGgrMdWn8=",
+      "requires": {
+        "delayed-stream": "~1.0.0"
+      }
+    },
     "commander": {
       "version": "2.20.3",
       "resolved": "https://registry.npm.taobao.org/commander/download/commander-2.20.3.tgz",
@@ -386,8 +445,19 @@
     "core-util-is": {
       "version": "1.0.2",
       "resolved": "https://registry.npm.taobao.org/core-util-is/download/core-util-is-1.0.2.tgz",
-      "integrity": "sha1-tf1UIgqivFq1eqtxQMlAdUUDwac=",
+      "integrity": "sha1-tf1UIgqivFq1eqtxQMlAdUUDwac="
-      "dev": true
+    },
+    "coveralls": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npm.taobao.org/coveralls/download/coveralls-3.1.0.tgz",
+      "integrity": "sha1-E8dU1eei3YtE/lJp4hyjlPtNYVs=",
+      "requires": {
+        "js-yaml": "^3.13.1",
+        "lcov-parse": "^1.0.0",
+        "log-driver": "^1.2.7",
+        "minimist": "^1.2.5",
+        "request": "^2.88.2"
+      }
     },
     "d3": {
       "version": "5.12.0",
@@ -653,12 +723,34 @@
         "d3-transition": "1"
       }
     },
+    "dashdash": {
+      "version": "1.14.1",
+      "resolved": "https://registry.npm.taobao.org/dashdash/download/dashdash-1.14.1.tgz",
+      "integrity": "sha1-hTz6D3y+L+1d4gMmuN1YEDX24vA=",
+      "requires": {
+        "assert-plus": "^1.0.0"
+      }
+    },
+    "delayed-stream": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npm.taobao.org/delayed-stream/download/delayed-stream-1.0.0.tgz",
+      "integrity": "sha1-3zrhmayt+31ECqrgsp4icrJOxhk="
+    },
     "diff": {
       "version": "4.0.2",
       "resolved": "https://registry.npm.taobao.org/diff/download/diff-4.0.2.tgz",
       "integrity": "sha1-YPOuy4nV+uUgwRqhnvwruYKq3n0=",
       "dev": true
     },
+    "ecc-jsbn": {
+      "version": "0.1.2",
+      "resolved": "https://registry.npm.taobao.org/ecc-jsbn/download/ecc-jsbn-0.1.2.tgz",
+      "integrity": "sha1-OoOpBOVDUyh4dMVkt1SThoSamMk=",
+      "requires": {
+        "jsbn": "~0.1.0",
+        "safer-buffer": "^2.1.0"
+      }
+    },
     "emojis-list": {
       "version": "3.0.0",
       "resolved": "https://registry.npm.taobao.org/emojis-list/download/emojis-list-3.0.0.tgz",
@@ -694,8 +786,27 @@
     "esprima": {
       "version": "4.0.1",
       "resolved": "https://registry.npm.taobao.org/esprima/download/esprima-4.0.1.tgz",
-      "integrity": "sha1-E7BM2z5sXRnfkatph6hpVhmwqnE=",
+      "integrity": "sha1-E7BM2z5sXRnfkatph6hpVhmwqnE="
-      "dev": true
+    },
+    "extend": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npm.taobao.org/extend/download/extend-3.0.2.tgz",
+      "integrity": "sha1-+LETa0Bx+9jrFAr/hYsQGewpFfo="
+    },
+    "extsprintf": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npm.taobao.org/extsprintf/download/extsprintf-1.3.0.tgz",
+      "integrity": "sha1-lpGEQOMEGnpBT4xS48V06zw+HgU="
+    },
+    "fast-deep-equal": {
+      "version": "3.1.3",
+      "resolved": "https://registry.npm.taobao.org/fast-deep-equal/download/fast-deep-equal-3.1.3.tgz?cache=0&sync_timestamp=1591599651635&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Ffast-deep-equal%2Fdownload%2Ffast-deep-equal-3.1.3.tgz",
+      "integrity": "sha1-On1WtVnWy8PrUSMlJE5hmmXGxSU="
+    },
+    "fast-json-stable-stringify": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npm.taobao.org/fast-json-stable-stringify/download/fast-json-stable-stringify-2.1.0.tgz",
+      "integrity": "sha1-h0v2nG9ATCtdmcSBNBOZ/VWJJjM="
     },
     "fill-range": {
       "version": "7.0.1",
@@ -706,12 +817,35 @@
         "to-regex-range": "^5.0.1"
       }
     },
+    "forever-agent": {
+      "version": "0.6.1",
+      "resolved": "https://registry.npm.taobao.org/forever-agent/download/forever-agent-0.6.1.tgz",
+      "integrity": "sha1-+8cfDEGt6zf5bFd60e1C2P2sypE="
+    },
+    "form-data": {
+      "version": "2.3.3",
+      "resolved": "https://registry.npm.taobao.org/form-data/download/form-data-2.3.3.tgz",
+      "integrity": "sha1-3M5SwF9kTymManq5Nr1yTO/786Y=",
+      "requires": {
+        "asynckit": "^0.4.0",
+        "combined-stream": "^1.0.6",
+        "mime-types": "^2.1.12"
+      }
+    },
     "fs.realpath": {
       "version": "1.0.0",
       "resolved": "https://registry.npm.taobao.org/fs.realpath/download/fs.realpath-1.0.0.tgz",
       "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8=",
       "dev": true
     },
+    "getpass": {
+      "version": "0.1.7",
+      "resolved": "https://registry.npm.taobao.org/getpass/download/getpass-0.1.7.tgz",
+      "integrity": "sha1-Xv+OPmhNVprkyysSgmBOi6YhSfo=",
+      "requires": {
+        "assert-plus": "^1.0.0"
+      }
+    },
     "glob": {
       "version": "7.1.6",
       "resolved": "https://registry.npm.taobao.org/glob/download/glob-7.1.6.tgz",
@@ -732,12 +866,36 @@
       "integrity": "sha1-Ila94U02MpWMRl68ltxGfKB6Kfs=",
       "dev": true
     },
+    "har-schema": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npm.taobao.org/har-schema/download/har-schema-2.0.0.tgz",
+      "integrity": "sha1-qUwiJOvKwEeCoNkDVSHyRzW37JI="
+    },
+    "har-validator": {
+      "version": "5.1.5",
+      "resolved": "https://registry.npm.taobao.org/har-validator/download/har-validator-5.1.5.tgz?cache=0&sync_timestamp=1596082653557&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fhar-validator%2Fdownload%2Fhar-validator-5.1.5.tgz",
+      "integrity": "sha1-HwgDufjLIMD6E4It8ezds2veHv0=",
+      "requires": {
+        "ajv": "^6.12.3",
+        "har-schema": "^2.0.0"
+      }
+    },
     "has-flag": {
       "version": "3.0.0",
       "resolved": "https://registry.npm.taobao.org/has-flag/download/has-flag-3.0.0.tgz",
       "integrity": "sha1-tdRU3CGZriJWmfNGfloH87lVuv0=",
       "dev": true
     },
+    "http-signature": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npm.taobao.org/http-signature/download/http-signature-1.2.0.tgz",
+      "integrity": "sha1-muzZJRFHcvPZW2WmCruPfBj7rOE=",
+      "requires": {
+        "assert-plus": "^1.0.0",
+        "jsprim": "^1.2.2",
+        "sshpk": "^1.7.0"
+      }
+    },
     "iconv-lite": {
       "version": "0.4.24",
       "resolved": "https://registry.npm.taobao.org/iconv-lite/download/iconv-lite-0.4.24.tgz",
@@ -768,12 +926,22 @@
       "integrity": "sha1-dTU0W4lnNNX4DE0GxQlVUnoU8Ss=",
       "dev": true
     },
+    "is-typedarray": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npm.taobao.org/is-typedarray/download/is-typedarray-1.0.0.tgz",
+      "integrity": "sha1-5HnICFjfDBsR3dppQPlgEfzaSpo="
+    },
     "isarray": {
       "version": "1.0.0",
       "resolved": "https://registry.npm.taobao.org/isarray/download/isarray-1.0.0.tgz",
       "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE=",
       "dev": true
     },
+    "isstream": {
+      "version": "0.1.2",
+      "resolved": "https://registry.npm.taobao.org/isstream/download/isstream-0.1.2.tgz",
+      "integrity": "sha1-R+Y/evVa+m+S4VAOaQ64uFKcCZo="
+    },
     "js-tokens": {
       "version": "4.0.0",
       "resolved": "https://registry.npm.taobao.org/js-tokens/download/js-tokens-4.0.0.tgz",
@@ -784,12 +952,31 @@
       "version": "3.14.0",
       "resolved": "https://registry.npm.taobao.org/js-yaml/download/js-yaml-3.14.0.tgz",
       "integrity": "sha1-p6NBcPJqIbsWJCTYray0ETpp5II=",
-      "dev": true,
       "requires": {
         "argparse": "^1.0.7",
         "esprima": "^4.0.0"
       }
     },
+    "jsbn": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npm.taobao.org/jsbn/download/jsbn-0.1.1.tgz",
+      "integrity": "sha1-peZUwuWi3rXyAdls77yoDA7y9RM="
+    },
+    "json-schema": {
+      "version": "0.2.3",
+      "resolved": "https://registry.npm.taobao.org/json-schema/download/json-schema-0.2.3.tgz",
+      "integrity": "sha1-tIDIkuWaLwWVTOcnvT8qTogvnhM="
+    },
+    "json-schema-traverse": {
+      "version": "0.4.1",
+      "resolved": "https://registry.npm.taobao.org/json-schema-traverse/download/json-schema-traverse-0.4.1.tgz?cache=0&sync_timestamp=1599333999343&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fjson-schema-traverse%2Fdownload%2Fjson-schema-traverse-0.4.1.tgz",
+      "integrity": "sha1-afaofZUTq4u4/mO9sJecRI5oRmA="
+    },
+    "json-stringify-safe": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npm.taobao.org/json-stringify-safe/download/json-stringify-safe-5.0.1.tgz",
+      "integrity": "sha1-Epai1Y/UXxmg9s4B1lcB4sc1tus="
+    },
     "json5": {
       "version": "1.0.1",
       "resolved": "https://registry.npm.taobao.org/json5/download/json5-1.0.1.tgz",
@@ -799,6 +986,22 @@
         "minimist": "^1.2.0"
       }
     },
+    "jsprim": {
+      "version": "1.4.1",
+      "resolved": "https://registry.npm.taobao.org/jsprim/download/jsprim-1.4.1.tgz",
+      "integrity": "sha1-MT5mvB5cwG5Di8G3SZwuXFastqI=",
+      "requires": {
+        "assert-plus": "1.0.0",
+        "extsprintf": "1.3.0",
+        "json-schema": "0.2.3",
+        "verror": "1.10.0"
+      }
+    },
+    "lcov-parse": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npm.taobao.org/lcov-parse/download/lcov-parse-1.0.0.tgz",
+      "integrity": "sha1-6w1GtUER68VhrLTECO+TY73I9+A="
+    },
     "loader-utils": {
       "version": "1.4.0",
       "resolved": "https://registry.npm.taobao.org/loader-utils/download/loader-utils-1.4.0.tgz",
@@ -810,6 +1013,11 @@
         "json5": "^1.0.1"
       }
     },
+    "log-driver": {
+      "version": "1.2.7",
+      "resolved": "https://registry.npm.taobao.org/log-driver/download/log-driver-1.2.7.tgz",
+      "integrity": "sha1-Y7lQIfBwL+36LJuwok53l9cYcdg="
+    },
     "memory-fs": {
       "version": "0.5.0",
       "resolved": "https://registry.npm.taobao.org/memory-fs/download/memory-fs-0.5.0.tgz",
@@ -830,6 +1038,19 @@
         "picomatch": "^2.0.5"
       }
     },
+    "mime-db": {
+      "version": "1.44.0",
+      "resolved": "https://registry.npm.taobao.org/mime-db/download/mime-db-1.44.0.tgz",
+      "integrity": "sha1-+hHF6wrKEzS0Izy01S8QxaYnL5I="
+    },
+    "mime-types": {
+      "version": "2.1.27",
+      "resolved": "https://registry.npm.taobao.org/mime-types/download/mime-types-2.1.27.tgz",
+      "integrity": "sha1-R5SfmOJ56lMRn1ci4PNOUpvsAJ8=",
+      "requires": {
+        "mime-db": "1.44.0"
+      }
+    },
     "minimatch": {
       "version": "3.0.4",
       "resolved": "https://registry.npm.taobao.org/minimatch/download/minimatch-3.0.4.tgz",
@@ -842,8 +1063,7 @@
     "minimist": {
       "version": "1.2.5",
       "resolved": "https://registry.npm.taobao.org/minimist/download/minimist-1.2.5.tgz",
-      "integrity": "sha1-Z9ZgFLZqaoqqDAg8X9WN9OTpdgI=",
+      "integrity": "sha1-Z9ZgFLZqaoqqDAg8X9WN9OTpdgI="
-      "dev": true
     },
     "mkdirp": {
       "version": "0.5.5",
@@ -854,6 +1074,11 @@
         "minimist": "^1.2.5"
       }
     },
+    "oauth-sign": {
+      "version": "0.9.0",
+      "resolved": "https://registry.npm.taobao.org/oauth-sign/download/oauth-sign-0.9.0.tgz",
+      "integrity": "sha1-R6ewFrqmi1+g7PPe4IqFxnmsZFU="
+    },
     "once": {
       "version": "1.4.0",
       "resolved": "https://registry.npm.taobao.org/once/download/once-1.4.0.tgz",
@@ -875,6 +1100,11 @@
       "integrity": "sha1-1i27VnlAXXLEc37FhgDp3c8G0kw=",
       "dev": true
     },
+    "performance-now": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npm.taobao.org/performance-now/download/performance-now-2.1.0.tgz",
+      "integrity": "sha1-Ywn04OX6kT7BxpMHrjZLSzd8nns="
+    },
     "picomatch": {
       "version": "2.2.2",
       "resolved": "https://registry.npm.taobao.org/picomatch/download/picomatch-2.2.2.tgz",
@@ -894,6 +1124,14 @@
       "resolved": "https://registry.npm.taobao.org/powerbi-visuals-utils-dataviewutils/download/powerbi-visuals-utils-dataviewutils-2.2.1.tgz",
       "integrity": "sha1-UmVtZXuLGt+3jaH7YvT6MRxYAwM="
     },
+    "powerbi-visuals-utils-typeutils": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npm.taobao.org/powerbi-visuals-utils-typeutils/download/powerbi-visuals-utils-typeutils-2.3.0.tgz",
+      "integrity": "sha1-WVlL5GLKvQcvLfQJ+tATaAgc4Bc=",
+      "requires": {
+        "coveralls": "^3.1.0"
+      }
+    },
     "process-nextick-args": {
       "version": "2.0.1",
       "resolved": "https://registry.npm.taobao.org/process-nextick-args/download/process-nextick-args-2.0.1.tgz",
@@ -906,6 +1144,21 @@
       "integrity": "sha1-0/wRS6BplaRexok/SEzrHXj19HY=",
       "dev": true
     },
+    "psl": {
+      "version": "1.8.0",
+      "resolved": "https://registry.npm.taobao.org/psl/download/psl-1.8.0.tgz",
+      "integrity": "sha1-kyb4vPsBOtzABf3/BWrM4CDlHCQ="
+    },
+    "punycode": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npm.taobao.org/punycode/download/punycode-2.1.1.tgz",
+      "integrity": "sha1-tYsBCsQMIsVldhbI0sLALHv0eew="
+    },
+    "qs": {
+      "version": "6.5.2",
+      "resolved": "https://registry.npm.taobao.org/qs/download/qs-6.5.2.tgz",
+      "integrity": "sha1-yzroBuh0BERYTvFUzo7pjUA/PjY="
+    },
     "readable-stream": {
       "version": "2.3.7",
       "resolved": "https://registry.npm.taobao.org/readable-stream/download/readable-stream-2.3.7.tgz",
@@ -926,6 +1179,33 @@
       "resolved": "https://registry.npm.taobao.org/regenerator-runtime/download/regenerator-runtime-0.13.7.tgz?cache=0&sync_timestamp=1595456105304&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fregenerator-runtime%2Fdownload%2Fregenerator-runtime-0.13.7.tgz",
       "integrity": "sha1-ysLazIoepnX+qrrriugziYrkb1U="
     },
+    "request": {
+      "version": "2.88.2",
+      "resolved": "https://registry.npm.taobao.org/request/download/request-2.88.2.tgz",
+      "integrity": "sha1-1zyRhzHLWofaBH4gcjQUb2ZNErM=",
+      "requires": {
+        "aws-sign2": "~0.7.0",
+        "aws4": "^1.8.0",
+        "caseless": "~0.12.0",
+        "combined-stream": "~1.0.6",
+        "extend": "~3.0.2",
+        "forever-agent": "~0.6.1",
+        "form-data": "~2.3.2",
+        "har-validator": "~5.1.3",
+        "http-signature": "~1.2.0",
+        "is-typedarray": "~1.0.0",
+        "isstream": "~0.1.2",
+        "json-stringify-safe": "~5.0.1",
+        "mime-types": "~2.1.19",
+        "oauth-sign": "~0.9.0",
+        "performance-now": "^2.1.0",
+        "qs": "~6.5.2",
+        "safe-buffer": "^5.1.2",
+        "tough-cookie": "~2.5.0",
+        "tunnel-agent": "^0.6.0",
+        "uuid": "^3.3.2"
+      }
+    },
     "resolve": {
       "version": "1.17.0",
       "resolved": "https://registry.npm.taobao.org/resolve/download/resolve-1.17.0.tgz",
@@ -943,8 +1223,7 @@
     "safe-buffer": {
       "version": "5.1.2",
       "resolved": "https://registry.npm.taobao.org/safe-buffer/download/safe-buffer-5.1.2.tgz",
-      "integrity": "sha1-mR7GnSluAxN0fVm9/St0XDX4go0=",
+      "integrity": "sha1-mR7GnSluAxN0fVm9/St0XDX4go0="
-      "dev": true
     },
     "safer-buffer": {
       "version": "2.1.2",
@@ -959,8 +1238,23 @@
     "sprintf-js": {
       "version": "1.0.3",
       "resolved": "https://registry.npm.taobao.org/sprintf-js/download/sprintf-js-1.0.3.tgz",
-      "integrity": "sha1-BOaSb2YolTVPPdAVIDYzuFcpfiw=",
+      "integrity": "sha1-BOaSb2YolTVPPdAVIDYzuFcpfiw="
-      "dev": true
+    },
+    "sshpk": {
+      "version": "1.16.1",
+      "resolved": "https://registry.npm.taobao.org/sshpk/download/sshpk-1.16.1.tgz",
+      "integrity": "sha1-+2YcC+8ps520B2nuOfpwCT1vaHc=",
+      "requires": {
+        "asn1": "~0.2.3",
+        "assert-plus": "^1.0.0",
+        "bcrypt-pbkdf": "^1.0.0",
+        "dashdash": "^1.12.0",
+        "ecc-jsbn": "~0.1.1",
+        "getpass": "^0.1.1",
+        "jsbn": "~0.1.0",
+        "safer-buffer": "^2.0.2",
+        "tweetnacl": "~0.14.0"
+      }
     },
     "string_decoder": {
       "version": "1.1.1",
@@ -995,6 +1289,15 @@
         "is-number": "^7.0.0"
       }
     },
+    "tough-cookie": {
+      "version": "2.5.0",
+      "resolved": "https://registry.npm.taobao.org/tough-cookie/download/tough-cookie-2.5.0.tgz",
+      "integrity": "sha1-zZ+yoKodWhK0c72fuW+j3P9lreI=",
+      "requires": {
+        "psl": "^1.1.28",
+        "punycode": "^2.1.1"
+      }
+    },
     "ts-loader": {
       "version": "6.1.0",
       "resolved": "https://registry.npm.taobao.org/ts-loader/download/ts-loader-6.1.0.tgz?cache=0&sync_timestamp=1598257188541&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fts-loader%2Fdownload%2Fts-loader-6.1.0.tgz",
@@ -1080,18 +1383,54 @@
         "tslib": "^1.8.1"
       }
     },
+    "tunnel-agent": {
+      "version": "0.6.0",
+      "resolved": "https://registry.npm.taobao.org/tunnel-agent/download/tunnel-agent-0.6.0.tgz",
+      "integrity": "sha1-J6XeoGs2sEoKmWZ3SykIaPD8QP0=",
+      "requires": {
+        "safe-buffer": "^5.0.1"
+      }
+    },
+    "tweetnacl": {
+      "version": "0.14.5",
+      "resolved": "https://registry.npm.taobao.org/tweetnacl/download/tweetnacl-0.14.5.tgz",
+      "integrity": "sha1-WuaBd/GS1EViadEIr6k/+HQ/T2Q="
+    },
     "typescript": {
       "version": "3.6.3",
       "resolved": "https://registry.npm.taobao.org/typescript/download/typescript-3.6.3.tgz?cache=0&sync_timestamp=1599288923492&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Ftypescript%2Fdownload%2Ftypescript-3.6.3.tgz",
       "integrity": "sha1-/qlC+rsg9+HKcWT/Ym8anz9wtNo=",
       "dev": true
     },
+    "uri-js": {
+      "version": "4.4.0",
+      "resolved": "https://registry.npm.taobao.org/uri-js/download/uri-js-4.4.0.tgz?cache=0&sync_timestamp=1598814588153&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Furi-js%2Fdownload%2Furi-js-4.4.0.tgz",
+      "integrity": "sha1-qnFCYd55PoqCNHp7zJznTobyhgI=",
+      "requires": {
+        "punycode": "^2.1.0"
+      }
+    },
     "util-deprecate": {
       "version": "1.0.2",
       "resolved": "https://registry.npm.taobao.org/util-deprecate/download/util-deprecate-1.0.2.tgz",
       "integrity": "sha1-RQ1Nyfpw3nMnYvvS1KKJgUGaDM8=",
       "dev": true
     },
+    "uuid": {
+      "version": "3.4.0",
+      "resolved": "https://registry.npm.taobao.org/uuid/download/uuid-3.4.0.tgz?cache=0&sync_timestamp=1595886825323&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fuuid%2Fdownload%2Fuuid-3.4.0.tgz",
+      "integrity": "sha1-sj5DWK+oogL+ehAK8fX4g/AgB+4="
+    },
+    "verror": {
+      "version": "1.10.0",
+      "resolved": "https://registry.npm.taobao.org/verror/download/verror-1.10.0.tgz",
+      "integrity": "sha1-OhBcoXBTr1XW4nDB+CiGguGNpAA=",
+      "requires": {
+        "assert-plus": "^1.0.0",
+        "core-util-is": "1.0.2",
+        "extsprintf": "^1.2.0"
+      }
+    },
     "wrappy": {
       "version": "1.0.2",
       "resolved": "https://registry.npm.taobao.org/wrappy/download/wrappy-1.0.2.tgz",

package.json

@@ -10,10 +10,11 @@
     "@babel/runtime": "7.6.0",
     "@babel/runtime-corejs2": "7.6.0",
     "@types/d3": "5.7.2",
+    "core-js": "3.2.1",
     "d3": "5.12.0",
-    "powerbi-visuals-utils-dataviewutils": "2.2.1",
     "powerbi-visuals-api": "~2.6.1",
-    "core-js": "3.2.1"
+    "powerbi-visuals-utils-dataviewutils": "2.2.1",
+    "powerbi-visuals-utils-typeutils": "^2.3.0"
   },
   "devDependencies": {
     "ts-loader": "6.1.0",

src/css/picsScroller.css

@@ -28,4 +28,11 @@ div.pics-scroll-invisible-img-container {
 
 img.pics-scroller-img {
     height: 100%;
+    position: relative;
+}
+
+p.pics-scroller-tag {
+    color: black;
+    margin: 0px;
+    position: relative;
 }

src/settings.ts

@@ -32,6 +32,7 @@ import DataViewObjectsParser = dataViewObjectsParser.DataViewObjectsParser;
 export class VisualSettings extends DataViewObjectsParser {
   public animation: AnimationSettings = new AnimationSettings();
   public layout:LayoutSettings=new LayoutSettings();
+  public tag:TagSettings=new TagSettings();
 }
 
 export class AnimationSettings {
@@ -43,3 +44,13 @@ export class LayoutSettings{
   public rowGap:number=2;//n% * height
   public columnGap:number=2;//n% * width
 }
+export class TagSettings{
+  public show:boolean=false;
+  public textSize:number=12;
+  public fontColor:string="black";
+  public transparency:number=0;
+  public position:TagPosition=TagPosition.above;
+}
+export enum TagPosition{
+  "above","bottom"
+}

src/visual.ts

@@ -36,13 +36,13 @@ import EnumerateVisualObjectInstancesOptions = powerbi.EnumerateVisualObjectInst
 import VisualObjectInstance = powerbi.VisualObjectInstance;
 import DataView = powerbi.DataView;
 import VisualObjectInstanceEnumerationObject = powerbi.VisualObjectInstanceEnumerationObject;
-
+import { VisualSettings, TagSettings ,TagPosition } from "./settings";
-import { VisualSettings } from "./settings";
 import * as d3 from "d3";
-
+import {pixelConverter} from "powerbi-visuals-utils-typeutils";
 
 export interface IPicsScrollerData {
     urls: string[];
+    tags?:string[];
 }
 export class Visual implements IVisual {
     private container: HTMLElement;
@@ -57,14 +57,14 @@ export class Visual implements IVisual {
         this.container = options.element;
         this.host=options.host;
         this.selectionManager=this.host.createSelectionManager();
-        d3.select(this.container).on("contextmenu", () => {
+        // d3.select(this.container).on("contextmenu", () => {
-            const mouseEvent: MouseEvent = <MouseEvent>d3.event;
+        //     const mouseEvent: MouseEvent = <MouseEvent>d3.event;
-            this.selectionManager.showContextMenu({}, {
+        //     this.selectionManager.showContextMenu({}, {
-                x: mouseEvent.clientX,
+        //         x: mouseEvent.clientX,
-                y: mouseEvent.clientY
+        //         y: mouseEvent.clientY
-            });
+        //     });
-            mouseEvent.preventDefault();
+        //     mouseEvent.preventDefault();
-        });
+        // });
     }
     private initial() {
         if (this.innerContainer) {
@@ -77,7 +77,27 @@ export class Visual implements IVisual {
     public update(options: VisualUpdateOptions) {
 
         let settings = Visual.parseSettings(options && options.dataViews && options.dataViews[0]);
-        let data: IPicsScrollerData = { urls: <string[]>options.dataViews[0].categorical.categories[0].values };
+        let urls:string[]=[];
+        let tags:string[]=[];
+        if(options.dataViews&&options.dataViews[0]&&options.dataViews[0].categorical){
+            let categorical=options.dataViews[0].categorical;
+            if(categorical.categories&&categorical.categories.length>0){
+                categorical.categories.map((field,index,array)=>{
+                    if(field&&field.values&&field.values.length>0){
+                        if(field.source.roles["urls"]){
+                            urls=<string[]>field.values;
+                        }else if(field.source.roles["tags"]){
+                            tags=<string[]>field.values;
+                        }
+                    }
+                });
+            }
+        }else{
+            this.innerContainer.remove();
+            return;
+        }
+
+        let data: IPicsScrollerData = { urls:urls ,tags:tags};
         let containerSize=[options.viewport.width,options.viewport.height];
 
         //处理输入
@@ -87,8 +107,6 @@ export class Visual implements IVisual {
         //interval
         settings.animation.interval=settings.animation.interval>0?settings.animation.interval:100;
         let interval = settings.animation.interval;
-
-
         //rowGap
         settings.layout.rowGap=(settings.layout.rowGap>=0&&settings.layout.rowGap<=100)?settings.layout.rowGap:0;
         let rowGap = options.viewport.height / 100 * settings.layout.rowGap;
@@ -99,8 +117,13 @@ export class Visual implements IVisual {
         settings.layout.rowsCount=settings.layout.rowsCount>=1?Math.floor(settings.layout.rowsCount):1;
         let rowsCount=settings.layout.rowsCount;
 
+        //tag
+        let tagFontSize:number=12;
+        if(settings.tag.show){
+            tagFontSize=pixelConverter.fromPointToPixel(settings.tag.textSize);
+        }
 
-        if (!(data.urls.length > 0) || !(rowsCount! > 0)) {
+        if (!(data.urls.length > 0) || !(rowsCount > 0)) {
             console.info("picsScroller error: (source_url.length,rowsCount) ", data.urls.length + "_" + rowsCount);
             return;
         };
@@ -108,12 +131,6 @@ export class Visual implements IVisual {
             rowsCount = data.urls.length;
         };
 
-        console.debug("data",JSON.stringify(data));
-        console.debug("this.data",JSON.stringify(this.data));
-        console.debug("settings",JSON.stringify(settings));
-        console.debug("this.settings",JSON.stringify(this.settings));
-        console.debug("containerSize",JSON.stringify(containerSize));
-        console.debug("this.containerSize",JSON.stringify(this.containerSize));
         let justifyEqual=function(a:any,b:any){
             return JSON.stringify(a)==JSON.stringify(b);
         };
@@ -132,10 +149,13 @@ export class Visual implements IVisual {
         let brandsCount = data.urls.length;
         let unitsCountPerRow = Math.floor(brandsCount / rowsCount);
         let logoUrlsArr: string[][] = [];
-
+        let tagsArr:string[][]=[];
         //转换url列表形态
         for (let i = 0; i < rowsCount; i++) {
             logoUrlsArr.push(data.urls.slice(i * unitsCountPerRow, Math.min((i + 1) * unitsCountPerRow, data.urls.length)));
+            if(data.tags&&data.tags.length>0){
+                tagsArr.push(data.tags.slice(i * unitsCountPerRow, Math.min((i + 1) * unitsCountPerRow, data.tags.length)));
+            };
         };
         //分成rowsCount行
         for (let rowNum = 0; rowNum < rowsCount; rowNum++) {
@@ -166,6 +186,21 @@ export class Visual implements IVisual {
                     logo.setAttribute("src", logoUrlsArr[rowNum][j]);
                     logoContainer.appendChild(logo);
                     rowContainer.appendChild(logoContainer);
+                    //tag patch
+                    if(settings.tag.show&&tagsArr&&tagsArr.length>0){
+                        logo.style.height="calc(100% - "+1.5*tagFontSize+"px)";
+                        let tagElement=document.createElement("p");
+                        tagElement.innerText=tagsArr[rowNum][j];
+                        tagElement.className="pics-scroller-tag";
+                        tagElement.style.fontSize=tagFontSize+"px";
+                        tagElement.style.height=1.5*tagFontSize+"px";
+
+                        if(settings.tag.position.toString()==TagPosition[TagPosition.above].toString()){
+                            logoContainer.insertBefore(tagElement,logo);
+                        }else{
+                            logoContainer.appendChild(tagElement);
+                        }
+                    }
                 };
             }
 

stringResources/zh-CN/resources.resjson

@@ -1,6 +1,8 @@
 {
     "roles-urls-displayName": "图片url",
     "roles-urls-description": "图片的url，例如：'http://www.example.com/xx.png'",
+    "roles-tags-displayName": "文本标签",
+    "roles-tags-description": "与图片一起显示的文本标签",
     "objects-layout-displayName": "布局",
     "objects-layout-rowsCount-displayName": "行数",
     "objects-layout-rowsCount-descriptionKey": "需要排列为几行？",
@@ -12,6 +14,13 @@
     "objects-animation-stepLength-displayName": "步长（%）",
     "objects-animation-stepLength-descriptionKey": "每个周期内滚动的长度占视觉对象宽度的百分比（%）",
     "objects-animation-interval-displayName": "周期（毫秒）",
-    "objects-animation-interval-descriptionKey": "滚动的间隔，单位（毫秒）"
+    "objects-animation-interval-descriptionKey": "滚动的间隔，单位（毫秒）",
-
+    "objects-tag-displayName": "标签",
+    "objects-tag-description": "跟随图片的文本标签",
+    "objects-tag-show-displayName": "显示",
+    "objects-tag-textSize-displayName": "字体大小",
+    "objects-tag-fontColor-displayName": "字体颜色",
+    "objects-tag-transparency-displayName": "透明度",
+    "objects-tag-position-enumeration-above-displayName": "上方",
+    "objects-tag-position-enumeration-bottom-displayName": "下方"
 }