npm - @amcharts/amcharts5 - Versions diffs - 5.13.5 → 5.14.0 - Mend

@amcharts/amcharts5 5.13.5 → 5.14.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (685) hide show

package/examples/javascript/flow-arc-horizontal/package.json CHANGED Viewed

@@ -3,7 +3,7 @@
   "name": "amcharts5-example-flow-arc-horizontal",
   "version": "0.1.0",
   "devDependencies": {
-    "@amcharts/amcharts5": "^5.13.5",
+    "@amcharts/amcharts5": "^5.14.0",
     "source-map-loader": "^4.0.1",
     "webpack": "^5.1.3",
     "webpack-cli": "^5.1.1",

package/examples/javascript/flow-arc-vertical/package.json CHANGED Viewed

@@ -3,7 +3,7 @@
   "name": "amcharts5-example-flow-arc-vertical",
   "version": "0.1.0",
   "devDependencies": {
-    "@amcharts/amcharts5": "^5.13.5",
+    "@amcharts/amcharts5": "^5.14.0",
     "source-map-loader": "^4.0.1",
     "webpack": "^5.1.3",
     "webpack-cli": "^5.1.1",

package/examples/javascript/flow-chord/package.json CHANGED Viewed

@@ -3,7 +3,7 @@
   "name": "amcharts5-example-flow-chord",
   "version": "0.1.0",
   "devDependencies": {
-    "@amcharts/amcharts5": "^5.13.5",
+    "@amcharts/amcharts5": "^5.14.0",
     "source-map-loader": "^4.0.1",
     "webpack": "^5.1.3",
     "webpack-cli": "^5.1.1",

package/examples/javascript/flow-chord-directed/package.json CHANGED Viewed

@@ -3,7 +3,7 @@
   "name": "amcharts5-example-flow-chord-directed",
   "version": "0.1.0",
   "devDependencies": {
-    "@amcharts/amcharts5": "^5.13.5",
+    "@amcharts/amcharts5": "^5.14.0",
     "source-map-loader": "^4.0.1",
     "webpack": "^5.1.3",
     "webpack-cli": "^5.1.1",

package/examples/javascript/flow-chord-non-ribbon/package.json CHANGED Viewed

@@ -3,7 +3,7 @@
   "name": "amcharts5-example-flow-chord-non-ribbon",
   "version": "0.1.0",
   "devDependencies": {
-    "@amcharts/amcharts5": "^5.13.5",
+    "@amcharts/amcharts5": "^5.14.0",
     "source-map-loader": "^4.0.1",
     "webpack": "^5.1.3",
     "webpack-cli": "^5.1.1",

package/examples/javascript/flow-sankey/package.json CHANGED Viewed

@@ -3,7 +3,7 @@
   "name": "amcharts5-example-flow-sankey",
   "version": "0.1.0",
   "devDependencies": {
-    "@amcharts/amcharts5": "^5.13.5",
+    "@amcharts/amcharts5": "^5.14.0",
     "source-map-loader": "^4.0.1",
     "webpack": "^5.1.3",
     "webpack-cli": "^5.1.1",

package/examples/javascript/gantt/README.md ADDED Viewed

@@ -0,0 +1,6 @@
+Steps to use
+============
+1. Run `yarn`
+2. Run `yarn start` for development, or `yarn build` for production

package/examples/javascript/gantt/index.css ADDED Viewed

@@ -0,0 +1,11 @@
+body {
+  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  padding: 0;
+  margin: 0;
+  background-color: #ffffff;
+}
+#chartdiv {
+  width: 100%;
+  height: 80vh;
+}

package/examples/javascript/gantt/index.html ADDED Viewed

@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="UTF-8" />
+    <title>amCharts 5 Example - gantt</title>
+    <link rel="stylesheet" href="index.css" />
+  </head>
+  <body>
+    <div id="chartdiv"></div>
+    <script src="dist/index.js"></script>
+  </body>
+</html>

package/examples/javascript/gantt/index.js ADDED Viewed

@@ -0,0 +1,233 @@
+import * as am5 from "@amcharts/amcharts5";
+import * as am5gantt from "@amcharts/amcharts5/gantt";
+import am5themes_Animated from "@amcharts/amcharts5/themes/Animated";
+// Create root element
+// https://www.amcharts.com/docs/v5/getting-started/#Root_element
+const root = am5.Root.new("chartdiv");
+// Set themes
+// https://www.amcharts.com/docs/v5/concepts/themes/
+root.setThemes([
+  am5themes_Animated.new(root)
+]);
+// Create Gantt chart
+// https://www.amcharts.com/docs/v5/charts/gantt/
+const gantt = root.container.children.push(am5gantt.Gantt.new(root, {}));
+// Configure Y-axis
+gantt.yAxis.setAll({
+  maxCellHeight: 70
+});
+// Default data
+let categoryData = [{
+  name: "Start",
+  id: "gantt_0"
+}, {
+  name: "Design",
+  id: "gantt_1"
+}, {
+  name: "Review",
+  id: "gantt_2",
+  parentId: "gantt_1",
+}, {
+  name: "User tests",
+  id: "gantt_3",
+  parentId: "gantt_1",
+}, {
+  name: "Programming",
+  id: "gantt_4"
+}, {
+  name: "Task delegation",
+  id: "gantt_5",
+  parentId: "gantt_4",
+}, {
+  name: "Coding",
+  id: "gantt_6",
+  parentId: "gantt_4",
+}, {
+  name: "Testing",
+  id: "gantt_7",
+  parentId: "gantt_4",
+}, {
+  name: "Deploying",
+  id: "gantt_8",
+  parentId: "gantt_4",
+}, {
+  name: "Testing",
+  id: "gantt_9"
+}, {
+  name: "Phase 1",
+  id: "gantt_10",
+  parentId: "gantt_9",
+}, {
+  name: "Phase 2",
+  id: "gantt_11",
+  parentId: "gantt_9",
+}, {
+  name: "Phase 3",
+  id: "gantt_12",
+  parentId: "gantt_9",
+}, {
+  name: "End",
+  id: "gantt_15"
+}];
+let seriesData = [{
+  start: 1758229200000,
+  duration: 0,
+  progress: 0,
+  id: "gantt_0",
+  linkTo: ["gantt_1"]
+}, {
+  "category": "gantt_1",
+  progress: 0,
+  id: "gantt_1",
+  linkTo: ["gantt_4"]
+}, {
+  "category": "gantt_2",
+  start: 1758488400000,
+  duration: 1,
+  progress: 1,
+  id: "gantt_2",
+  linkTo: ["gantt_3"]
+}, {
+  "category": "gantt_3",
+  start: 1758574800000,
+  duration: 1,
+  progress: 1,
+  id: "gantt_3",
+  linkTo: []
+}, {
+  "category": "gantt_4",
+  progress: 0,
+  id: "gantt_4",
+  linkTo: ["gantt_9"]
+}, {
+  "category": "gantt_5",
+  start: 1758747600000,
+  duration: 1,
+  progress: 1,
+  id: "gantt_5",
+  linkTo: ["gantt_6"]
+}, {
+  "category": "gantt_6",
+  start: 1758834000000,
+  duration: 2,
+  progress: 0.4956235693230202,
+  id: "gantt_6",
+  linkTo: ["gantt_7"]
+}, {
+  "category": "gantt_7",
+  start: 1759179600000,
+  duration: 1,
+  progress: 0,
+  id: "gantt_7",
+  linkTo: ["gantt_8"]
+}, {
+  "category": "gantt_8",
+  start: 1759266000000,
+  duration: 2,
+  progress: 0,
+  id: "gantt_8"
+}, {
+  "category": "gantt_9",
+  progress: 0,
+  id: "gantt_9",
+  linkTo: ["gantt_15"]
+}, {
+  "category": "gantt_10",
+  start: 1759438800000,
+  duration: 1,
+  progress: 0,
+  id: "gantt_10",
+  linkTo: ["gantt_11"]
+}, {
+  "category": "gantt_11",
+  start: 1759698000000,
+  duration: 1,
+  progress: 0,
+  id: "gantt_11",
+  linkTo: ["gantt_12"]
+}, {
+  "category": "gantt_12",
+  start: 1759784400000,
+  duration: 2,
+  progress: 0,
+  id: "gantt_12"
+}, {
+  start: 1760302800000,
+  duration: 0,
+  progress: 0,
+  id: "gantt_15"
+}];
+let markedDates = [1758661200000, 1759352400000];
+// Check if we have user-saved data in local storage
+function loadGanttData() {
+  if (localStorage.getItem("am_gantt_data")) {
+    return JSON.parse(localStorage.getItem("am_gantt_data"));
+  }
+  return {};
+}
+function saveGanttData(gantt_data) {
+  localStorage.setItem("am_gantt_data", JSON.stringify(gantt_data));
+  console.log("Data saved to localStorage");
+}
+function saveGanttMarkedDates() {
+  const gantt_data = loadGanttData();
+  gantt_data.markedDates = gantt.xAxisMinor.axisRanges.values.map((range) => {
+    return range.get("value");
+  });
+  saveGanttData(gantt_data);
+}
+const gantt_data = loadGanttData();
+if (gantt_data.categoryData) {
+  categoryData = gantt_data.categoryData;
+}
+if (gantt_data.seriesData) {
+  seriesData = gantt_data.seriesData;
+}
+if (gantt_data.markedDates) {
+  markedDates = gantt_data.markedDates;
+}
+// Create axis ranges for marked dates
+am5.array.each(markedDates, (value) => {
+  gantt.markDate(value);
+});
+// Set data on axis and series
+// https://www.amcharts.com/docs/v5/charts/gantt/#Category_data
+// https://www.amcharts.com/docs/v5/charts/gantt/#Series_data
+gantt.yAxis.data.setAll(categoryData);
+gantt.series.data.setAll(seriesData);
+// Set up saving of data
+gantt.events.onDebounced("valueschanged", (ev) => {
+  gantt_data.categoryData = gantt.yAxis.data.values;
+  gantt_data.seriesData = gantt.series.data.values;
+  saveGanttData(gantt_data);
+}, 500);
+gantt.events.on("datemarked", (ev) => {
+  console.log("Date marked: " + ev.date + " (" + new Date(ev.date) + ") in " + ev.dataItem.get(name));
+  saveGanttMarkedDates();
+});
+gantt.events.on("dateunmarked", (ev) => {
+  console.log("Date unmarked: " + ev.date + " (" + new Date(ev.date) + ") in " + ev.dataItem.get(name));
+  saveGanttMarkedDates();
+});
+gantt.appear();

package/examples/javascript/gantt/package.json ADDED Viewed

@@ -0,0 +1,16 @@
+{
+  "private": true,
+  "name": "amcharts5-example-gantt",
+  "version": "0.1.0",
+  "devDependencies": {
+    "@amcharts/amcharts5": "^5.14.0",
+    "source-map-loader": "^4.0.1",
+    "webpack": "^5.1.3",
+    "webpack-cli": "^5.1.1",
+    "webpack-dev-server": "^4.15.0"
+  },
+  "scripts": {
+    "build": "webpack",
+    "start": "webpack serve --mode development"
+  }
+}

package/examples/javascript/gantt/webpack.config.js ADDED Viewed

@@ -0,0 +1,38 @@
+var $path = require("path");
+module.exports = {
+  mode: "production",
+  devtool: "source-map",
+  stats: "errors-warnings",
+  target: ["web", "es5"],
+  entry: {
+    index: "./index.js",
+  },
+  devServer: {
+    publicPath: "/dist/",
+    liveReload: true,
+    overlay: true,
+    noInfo: true,
+    open: true
+  },
+  output: {
+    path: $path.join(__dirname, "dist"),
+    publicPath: "dist/",
+    filename: "[name].js",
+    chunkFilename: "[name].js"
+  },
+  module: {
+    rules: [{
+      test: /.js$/,
+      use: ["source-map-loader"],
+      enforce: "pre"
+    }]
+  }
+};

package/examples/javascript/gantt-multilevel/README.md ADDED Viewed

@@ -0,0 +1,6 @@
+Steps to use
+============
+1. Run `yarn`
+2. Run `yarn start` for development, or `yarn build` for production

package/examples/javascript/gantt-multilevel/index.css ADDED Viewed

@@ -0,0 +1,11 @@
+body {
+  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  padding: 0;
+  margin: 0;
+  background-color: #ffffff;
+}
+#chartdiv {
+  width: 100%;
+  height: 80vh;
+}

package/examples/javascript/gantt-multilevel/index.html ADDED Viewed

@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="UTF-8" />
+    <title>amCharts 5 Example - gantt-multilevel</title>
+    <link rel="stylesheet" href="index.css" />
+  </head>
+  <body>
+    <div id="chartdiv"></div>
+    <script src="dist/index.js"></script>
+  </body>
+</html>

package/examples/javascript/gantt-multilevel/index.js ADDED Viewed

@@ -0,0 +1,111 @@
+import * as am5 from "@amcharts/amcharts5";
+import * as am5gantt from "@amcharts/amcharts5/gantt";
+import am5themes_Animated from "@amcharts/amcharts5/themes/Animated";
+// Create root element
+// https://www.amcharts.com/docs/v5/getting-started/#Root_element
+const root = am5.Root.new("chartdiv");
+// Set themes
+// https://www.amcharts.com/docs/v5/concepts/themes/
+root.setThemes([
+  am5themes_Animated.new(root)
+]);
+// Create Gantt chart
+// https://www.amcharts.com/docs/v5/charts/gantt/
+const gantt = root.container.children.push(am5gantt.Gantt.new(root, {}));
+gantt.yAxis.setAll({
+  maxCellHeight: 70
+});
+// Set category data
+// https://www.amcharts.com/docs/v5/charts/gantt/#Category_data
+gantt.yAxis.data.setAll([{
+  name: "Idea",
+  id: "gantt_0"
+}, {
+  name: "Preparation",
+  id: "gantt_1"
+}, {
+  name: "Kick-off",
+  id: "gantt_2",
+  parentId: "gantt_1"
+}, {
+  name: "Planning",
+  id: "gantt_3",
+  parentId: "gantt_1"
+}, {
+  name: "Implementation",
+  id: "gantt_4"
+}, {
+  name: "Setup",
+  id: "gantt_5",
+  parentId: "gantt_4"
+}, {
+  name: "Development",
+  id: "gantt_6",
+  parentId: "gantt_4"
+}, {
+  name: "Finalization",
+  id: "gantt_7",
+  parentId: "gantt_4"
+}, {
+  name: "Release",
+  id: "gantt_8"
+}]);
+// Set series data
+// https://www.amcharts.com/docs/v5/charts/gantt/#Series_data
+gantt.series.data.setAll([{
+  start: 1758142800000,
+  duration: 0,
+  progress: 0,
+  id: "gantt_0",
+  linkTo: ["gantt_1"]
+}, {
+  start: 1758142800000,
+  id: "gantt_1"
+}, {
+  start: 1758142800000,
+  duration: 2,
+  progress: 0,
+  id: "gantt_2",
+  linkTo: ["gantt_3"]
+}, {
+  start: 1758488400000,
+  duration: 2,
+  progress: 0,
+  id: "gantt_3",
+  linkTo: ["gantt_4"]
+}, {
+  start: 1758661200000,
+  id: "gantt_4"
+}, {
+  start: 1758661200000,
+  duration: 1,
+  progress: 0,
+  id: "gantt_5",
+  linkTo: ["gantt_6"]
+}, {
+  start: 1758747600000,
+  duration: 3,
+  progress: 0,
+  id: "gantt_6",
+  linkTo: ["gantt_7"]
+}, {
+  start: 1759179600000,
+  duration: 1,
+  progress: 0,
+  id: "gantt_7",
+  linkTo: ["gantt_8"]
+}, {
+  start: 1759179600000,
+  duration: 0,
+  progress: 0,
+  id: "gantt_8"
+}]);
+gantt.appear();

package/examples/javascript/gantt-multilevel/package.json ADDED Viewed

@@ -0,0 +1,16 @@
+{
+  "private": true,
+  "name": "amcharts5-example-gantt-multilevel",
+  "version": "0.1.0",
+  "devDependencies": {
+    "@amcharts/amcharts5": "^5.14.0",
+    "source-map-loader": "^4.0.1",
+    "webpack": "^5.1.3",
+    "webpack-cli": "^5.1.1",
+    "webpack-dev-server": "^4.15.0"
+  },
+  "scripts": {
+    "build": "webpack",
+    "start": "webpack serve --mode development"
+  }
+}

package/examples/javascript/gantt-multilevel/webpack.config.js ADDED Viewed

@@ -0,0 +1,38 @@
+var $path = require("path");
+module.exports = {
+  mode: "production",
+  devtool: "source-map",
+  stats: "errors-warnings",
+  target: ["web", "es5"],
+  entry: {
+    index: "./index.js",
+  },
+  devServer: {
+    publicPath: "/dist/",
+    liveReload: true,
+    overlay: true,
+    noInfo: true,
+    open: true
+  },
+  output: {
+    path: $path.join(__dirname, "dist"),
+    publicPath: "dist/",
+    filename: "[name].js",
+    chunkFilename: "[name].js"
+  },
+  module: {
+    rules: [{
+      test: /.js$/,
+      use: ["source-map-loader"],
+      enforce: "pre"
+    }]
+  }
+};

package/examples/javascript/gantt-simple/README.md ADDED Viewed

@@ -0,0 +1,6 @@
+Steps to use
+============
+1. Run `yarn`
+2. Run `yarn start` for development, or `yarn build` for production

package/examples/javascript/gantt-simple/index.css ADDED Viewed

@@ -0,0 +1,11 @@
+body {
+  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  padding: 0;
+  margin: 0;
+  background-color: #ffffff;
+}
+#chartdiv {
+  width: 100%;
+  height: 80vh;
+}

package/examples/javascript/gantt-simple/index.html ADDED Viewed

@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="UTF-8" />
+    <title>amCharts 5 Example - gantt-simple</title>
+    <link rel="stylesheet" href="index.css" />
+  </head>
+  <body>
+    <div id="chartdiv"></div>
+    <script src="dist/index.js"></script>
+  </body>
+</html>