echarts-wordcloud - npm Package Compare versions

Comparing version 1.1.3 to 2.0.0

index.js

@@ -1,1 +0,1 @@
-module.exports = require('./src/wordCloud');
+import './src/wordCloud';

package.json

 {
   "name": "echarts-wordcloud",
-  "version": "1.1.3",
+  "version": "2.0.0",
   "description": "ECharts wordcloud extension based on wordcloud2.js",
@@ -8,4 +8,10 @@ "main": "index.js",
   "license": "ISC",
-  "dependencies": {
+  "scripts": {
+    "dev": "npx webpack --mode development --watch",
+    "build": "npx webpack --mode development",
+    "release": "npx webpack --mode production && npx webpack --mode development"
   },
+  "peerDependencies": {
+    "echarts": "^5.0.1"
+  },
   "repository": {
@@ -16,6 +22,6 @@ "type": "git",
   "devDependencies": {
-    "esprima": "^2.7.2",
-    "fs-extra": "^0.30.0",
-    "glob": "^7.0.3"
+    "echarts": "^5.0.1",
+    "webpack": "^5.11.1",
+    "webpack-cli": "^4.3.1"
   }
 }

README.md

@@ -1,7 +0,3 @@
-# [ECharts](https://github.com/ecomfe/echarts) wordcloud extension based on [wordcloud2.js](https://github.com/timdream/wordcloud2.js)
+# [Apache ECharts (incubating)](https://github.com/apache/incubator-echarts) wordcloud extension based on [wordcloud2.js](https://github.com/timdream/wordcloud2.js)
 
-<a href="http://echarts.baidu.com">
-    <img style="vertical-align: top;" src="https://github.com/ecomfe/echarts/raw/master/asset/logo.png?raw=true" alt="logo" height="50px">
-</a>
-
 ![](./example/word-cloud.png)
@@ -31,6 +27,11 @@
 ```js
-var echarts = require('echarts');
-require('echarts-wordcloud');
+import * as echarts from 'echarts'
+import 'echarts-wordcloud';
 ```
 
+NOTE:
+
+echarts-wordcloud@2 is for echarts@5
+echarts-wordcloud@1 is for echarts@4
+
 ## Usage
@@ -87,18 +88,24 @@
 
+        // If perform layout animation.
+        // NOTE disable it will lead to UI blocking when there is lots of words.
+        layoutAnimation: true,
+
         // Global text style
         textStyle: {
-            normal: {
-                fontFamily: 'sans-serif',
-                fontWeight: 'bold',
-                // Color can be a callback function or a color string
-                color: function () {
-                    // Random color
-                    return 'rgb(' + [
-                        Math.round(Math.random() * 160),
-                        Math.round(Math.random() * 160),
-                        Math.round(Math.random() * 160)
-                    ].join(',') + ')';
-                }
-            },
-            emphasis: {
+            fontFamily: 'sans-serif',
+            fontWeight: 'bold',
+            // Color can be a callback function or a color string
+            color: function () {
+                // Random color
+                return 'rgb(' + [
+                    Math.round(Math.random() * 160),
+                    Math.round(Math.random() * 160),
+                    Math.round(Math.random() * 160)
+                ].join(',') + ')';
+            }
+        },
+        emphasis: {
+            focus: 'self',
+
+            textStyle: {
                 shadowBlur: 10,
@@ -115,4 +122,2 @@ shadowColor: '#333'
             textStyle: {
-                normal: {},
-                emphasis: {}
             }
@@ -119,0 +124,0 @@ }]

src/layout.js

@@ -89,4 +89,2 @@ /*!
 
-(function(global) {
-
   // Check if WordCloud can run on this browser
@@ -197,2 +195,4 @@ var isSupported = (function isSupported() {
 
+      layoutAnimation: true,
+
       wait: 0,
@@ -1107,3 +1107,12 @@ abortThreshold: 0, // disabled
       var loopingFunction, stoppingFunction;
-      if (settings.wait !== 0) {
+      var layouting = true;
+      if (!settings.layoutAnimation) {
+        loopingFunction = function (cb) {
+          cb();
+        }
+        stoppingFunction = function () {
+          layouting = false;
+        }
+      }
+      else if (settings.wait !== 0) {
         loopingFunction = window.setTimeout;
@@ -1135,3 +1144,7 @@ stoppingFunction = window.clearTimeout;
 
-      var timer = loopingFunction(function loop() {
+      // At least wait the following code before call the first iteration.
+      var timer = (settings.layoutAnimation ? loopingFunction : setTimeout)(function loop() {
+        if (!layouting) {
+          return;
+        }
         if (i >= settings.list.length) {
@@ -1168,11 +1181,2 @@ stoppingFunction(timer);
 
-  // Expose the library as an AMD module
-  if (typeof define === 'function' && define.amd) {
-    define('wordcloud', [], function() { return WordCloud; });
-  } else if (typeof module !== 'undefined' && module.exports) {
-    module.exports = WordCloud;
-  } else {
-    global.WordCloud = WordCloud;
-  }
-
-})(this); //jshint ignore:line
+  export default WordCloud;

src/wordCloud.js

@@ -1,8 +0,7 @@
-var echarts = require('echarts/lib/echarts');
-var layoutUtil = require('echarts/lib/util/layout');
+import * as echarts from 'echarts/lib/echarts';
 
-require('./WordCloudSeries');
-require('./WordCloudView');
+import './WordCloudSeries';
+import './WordCloudView';
 
-var wordCloudLayoutHelper = require('./layout');
+import wordCloudLayoutHelper from './layout';
 
@@ -62,3 +61,3 @@ if (!wordCloudLayoutHelper.isSupported) {
     ecModel.eachSeriesByType('wordCloud', function (seriesModel) {
-        var gridRect = layoutUtil.getLayoutRect(
+        var gridRect = echarts.helper.getLayoutRect(
             seriesModel.getBoxLayoutParams(), {
@@ -99,3 +98,3 @@ width: api.getWidth(),
                     data.getName(idx),
-                    itemModel.get('textStyle.normal.textSize', true)
+                    itemModel.get('textStyle.fontSize', true)
                         || echarts.number.linearMap(value, valueExtent, sizeRange),
@@ -108,8 +107,9 @@ idx
             }),
-            fontFamily: seriesModel.get('textStyle.normal.fontFamily')
-                || seriesModel.get('textStyle.emphasis.fontFamily')
+            fontFamily: seriesModel.get('textStyle.fontFamily')
+                || seriesModel.get('emphasis.textStyle.fontFamily')
                 || ecModel.get('textStyle.fontFamily'),
-            fontWeight: seriesModel.get('textStyle.normal.fontWeight')
-                || seriesModel.get('textStyle.emphasis.fontWeight')
+            fontWeight: seriesModel.get('textStyle.fontWeight')
+                || seriesModel.get('emphasis.textStyle.fontWeight')
                 || ecModel.get('textStyle.fontWeight'),
+
             gridSize: gridSize,
@@ -130,2 +130,4 @@
 
+            layoutAnimation: seriesModel.get('layoutAnimation'),
+
             shuffle: false,
@@ -132,0 +134,0 @@

src/WordCloudSeries.js

@@ -1,3 +0,2 @@
-var completeDimensions = require('echarts/lib/data/helper/completeDimensions');
-var echarts = require('echarts/lib/echarts');
+import * as echarts from 'echarts/lib/echarts';
 
@@ -8,3 +7,9 @@ echarts.extendSeriesModel({
 
-    visualColorAccessPath: 'textStyle.normal.color',
+    visualStyleAccessPath: 'textStyle',
+    visualStyleMapper: function (model) {
+        return {
+            fill: model.get('color')
+        };
+    },
+    visualDrawType: 'fill',
 
@@ -17,3 +22,5 @@ optionUpdated: function () {
     getInitialData: function (option, ecModel) {
-        var dimensions = completeDimensions(['value'], option.data);
+        var dimensions = echarts.helper.createDimensions(option.data, {
+            coordDimensions: ['value']
+        });
         var list = new echarts.List(dimensions, this);
@@ -51,7 +58,5 @@ list.initData(option.data);
         textStyle: {
-            normal: {
-                fontWeight: 'normal'
-            }
+            fontWeight: 'normal'
         }
     }
 });

src/WordCloudView.js

@@ -1,7 +0,3 @@
-var echarts = require('echarts/lib/echarts');
+import * as echarts from 'echarts/lib/echarts';
 
-function getShallow(model, path) {
-    return model && model.getShallow(path);
-}
-
 echarts.extendChartView({
@@ -21,21 +17,20 @@
             var itemModel = data.getItemModel(dataIdx);
-            var textStyleModel = itemModel.getModel('textStyle.normal');
-            var emphasisTextStyleModel = itemModel.getModel('textStyle.emphasis');
+            var textStyleModel = itemModel.getModel('textStyle');
 
             var textEl = new echarts.graphic.Text({
-                style: echarts.graphic.setTextStyle({}, textStyleModel, {
-                    x: drawn.info.fillTextOffsetX,
-                    y: drawn.info.fillTextOffsetY + size * 0.5,
-                    text: text,
-                    textBaseline: 'middle',
-                    textFill: data.getItemVisual(dataIdx, 'color'),
-                    fontSize: size
-                }),
-                scale: [1 / drawn.info.mu, 1 / drawn.info.mu],
-                position: [
-                    (drawn.gx + drawn.info.gw / 2) * gridSize,
-                    (drawn.gy + drawn.info.gh / 2) * gridSize
-                ],
+                style: echarts.helper.createTextStyle(textStyleModel),
+                scaleX: 1 / drawn.info.mu,
+                scaleY: 1 / drawn.info.mu,
+                x: (drawn.gx + drawn.info.gw / 2) * gridSize,
+                y: (drawn.gy + drawn.info.gh / 2) * gridSize,
                 rotation: drawn.rot
             });
+            textEl.setStyle({
+                x: drawn.info.fillTextOffsetX,
+                y: drawn.info.fillTextOffsetY + size * 0.5,
+                text: text,
+                verticalAlign: 'middle',
+                fill: data.getItemVisual(dataIdx, 'style').fill,
+                fontSize: size
+            });
 
@@ -46,6 +41,21 @@ group.add(textEl);
 
-            echarts.graphic.setHoverStyle(
+            textEl.ensureState('emphasis').style = echarts.helper.createTextStyle(itemModel.getModel(['emphasis', 'textStyle']), {
+                state: 'emphasis'
+            });
+            textEl.ensureState('blur').style = echarts.helper.createTextStyle(itemModel.getModel(['blur', 'textStyle']), {
+                state: 'blur'
+            });
+
+            echarts.helper.enableHoverEmphasis(
                 textEl,
-                echarts.graphic.setTextStyle({}, emphasisTextStyleModel, null, {forMerge: true}, true)
+                itemModel.get(['emphasis', 'focus']),
+                itemModel.get(['emphasis', 'blurScope'])
             );
+
+            textEl.stateTransition = {
+                duration: seriesModel.get('animation') ? seriesModel.get(['stateAnimation', 'duration']) : 0,
+                easing: seriesModel.get(['stateAnimation', 'easing'])
+            };
+            // TODO
+            textEl.__highDownDispatcher = true;
         };
@@ -52,0 +62,0 @@

webpack.config.js

@@ -1,16 +0,20 @@
-var PROD = process.argv.indexOf('-p') >= 0;
-
-module.exports = {
-    entry: {
-        'echarts-wordcloud': __dirname + '/index.js'
-    },
-    output: {
-        libraryTarget: 'umd',
-        library: ['echarts-wordcloud'],
-        path: __dirname + '/dist',
-        filename: PROD ? '[name].min.js' : '[name].js'
-    },
-    externals: {
-        'echarts/lib/echarts': 'echarts'
-    }
+module.exports = (env, options) => {
+    return {
+        entry: {
+            'echarts-wordcloud': __dirname + '/index.js'
+        },
+        output: {
+            libraryTarget: 'umd',
+            library: ['echarts-wordcloud'],
+            path: __dirname + '/dist',
+            filename: options.mode === 'production' ? '[name].min.js' : '[name].js'
+        },
+        optimization: {
+            concatenateModules: true
+        },
+        devtool: 'source-map',
+        externals: {
+            'echarts/lib/echarts': 'echarts'
+        }
+    };
 };

New alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Fixed alerts

Uses eval

Supply chain risk

Package uses eval() which is a dangerous function. This prevents the code from running in certain environments and increases the risk that the code may contain exploits or malicious behavior.

Found 2 instances in 1 package

Improved metrics

Number of package files

12

increased by20%

Number of lines in readme file

125

increased by4.17%

Number of medium supply chain risk alerts

2

decreased by-50%

Worsened metrics

Total package byte prevSize

247769

decreased by-58.87%

Dependency count

1

increased byInfinity%

Lines of code

2666

decreased by-82.72%

No dependency changes