diff --git a/theme/azul.js b/theme/azul.js new file mode 100644 index 0000000000..1001db3bb7 --- /dev/null +++ b/theme/azul.js @@ -0,0 +1,147 @@ +/* +* Licensed to the Apache Software Foundation (ASF) under one +* or more contributor license agreements. See the NOTICE file +* distributed with this work for additional information +* regarding copyright ownership. The ASF licenses this file +* to you under the Apache License, Version 2.0 (the +* "License"); you may not use this file except in compliance +* with the License. You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, +* software distributed under the License is distributed on an +* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY +* KIND, either express or implied. See the License for the +* specific language governing permissions and limitations +* under the License. +*/ + +(function (root, factory) {if (typeof define === 'function' && define.amd) { + // AMD. Register as an anonymous module. + define(['exports', 'echarts'], factory); + } else if (typeof exports === 'object' && typeof exports.nodeName !== 'string') { + // CommonJS + factory(exports, require('echarts')); + } else { + // Browser globals + factory({}, root.echarts); + } +}(this, function (exports, echarts) { + var log = function (msg) { + if (typeof console !== 'undefined') { + console && console.error && console.error(msg); + } + }; + if (!echarts) { + log('ECharts is not Loaded'); + return; + } + + var colorPalette = [ + '#f2385a','#f5a503','#4ad9d9','#f7879c', + '#c1d7a8','#4dffd2','#fccfd7','#d5f6f6' + ]; + + var theme = { + + color: colorPalette, + + title: { + textStyle: { + fontWeight: 'normal', + color: '#f2385a' + } + }, + + visualMap: { + color: ['#f2385a','#f5a503'] + }, + + toolbox: { + color: ['#f2385a','#f2385a','#f2385a','#f2385a'] + }, + + tooltip: { + backgroundColor: 'rgba(0,0,0,0.5)', + axisPointer: { // Axis indicator, coordinate trigger effective + type: 'line', // The default is a straight line： 'line' | 'shadow' + lineStyle: { // Straight line indicator style settings + color: '#f2385a', + type: 'dashed' + }, + crossStyle: { + color: '#f2385a' + }, + shadowStyle: { // Shadow indicator style settings + color: 'rgba(200,200,200,0.3)' + } + } + }, + + // Area scaling controller + dataZoom: { + dataBackgroundColor: '#eee', // Data background color + fillerColor: 'rgba(200,200,200,0.2)', // Fill the color + handleColor: '#f2385a' // Handle color + }, + + timeline: { + lineStyle: { + color: '#f2385a' + }, + controlStyle: { + color: '#f2385a', + borderColor: '#f2385a' + } + }, + + candlestick: { + itemStyle: { + color: '#f2385a', + color0: '#f5a503', + }, + lineStyle: { + width: 1, + color: '#f2385a', + color0: '#f5a503', + }, + areaStyle: { + color: '#c1d7a8', + color0: '#4ad9d9' + } + }, + + map: { + itemStyle: { + color: '#f2385a', + }, + areaStyle: { + color: '#ddd', + }, + label: { + color: '#c12e34' + } + }, + + graph: { + itemStyle: { + color: '#f2385a', + }, + linkStyle: { + color: '#f2385a' + } + }, + + gauge: { + axisLine: { + lineStyle: { + color: [[0.2, '#f5a503'],[0.8, '#f2385a'],[1, '#c1d7a8']], + width: 8 + } + } + } + }; + + echarts.registerTheme('azul', theme); +})); \ No newline at end of file diff --git a/theme/bee-inspired.js b/theme/bee-inspired.js new file mode 100644 index 0000000000..facf430928 --- /dev/null +++ b/theme/bee-inspired.js @@ -0,0 +1,162 @@ +/* +* Licensed to the Apache Software Foundation (ASF) under one +* or more contributor license agreements. See the NOTICE file +* distributed with this work for additional information +* regarding copyright ownership. The ASF licenses this file +* to you under the Apache License, Version 2.0 (the +* "License"); you may not use this file except in compliance +* with the License. You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, +* software distributed under the License is distributed on an +* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY +* KIND, either express or implied. See the License for the +* specific language governing permissions and limitations +* under the License. +*/ + +(function (root, factory) {if (typeof define === 'function' && define.amd) { + // AMD. Register as an anonymous module. + define(['exports', 'echarts'], factory); + } else if (typeof exports === 'object' && typeof exports.nodeName !== 'string') { + // CommonJS + factory(exports, require('echarts')); + } else { + // Browser globals + factory({}, root.echarts); + } +}(this, function (exports, echarts) { + var log = function (msg) { + if (typeof console !== 'undefined') { + console && console.error && console.error(msg); + } + }; + if (!echarts) { + log('ECharts is not Loaded'); + return; + } + + var colorPalette = [ + '#001727','#805500','#ffff00','#ffd11a', + '#f2d71f','#f2be19','#f3a81a','#fff5cc' + ]; + + var theme = { + + color: colorPalette, + + title: { + textStyle: { + fontWeight: 'normal', + color: '#001727' + } + }, + + visualMap: { + color:['#001727','#805500'] + }, + + toolbox: { + color: ['#001727','#001727','#001727','#001727'] + }, + + tooltip: { + backgroundColor: 'rgba(0,0,0,0.5)', + axisPointer: { // Axis indicator, coordinate trigger effective + type: 'line', // The default is a straight line： 'line' | 'shadow' + lineStyle: { // Straight line indicator style settings + color: '#001727', + type: 'dashed' + }, + crossStyle: { + color: '#001727' + }, + shadowStyle: { // Shadow indicator style settings + color: 'rgba(200,200,200,0.3)' + } + } + }, + + // Area scaling controller + dataZoom: { + dataBackgroundColor: '#eee', // Data background color + fillerColor: 'rgba(200,200,200,0.2)', // Fill the color + handleColor: '#001727' // Handle color + }, + + timeline: { + lineStyle: { + color: '#001727' + }, + controlStyle: { + color: '#001727', + borderColor: '#001727' + } + }, + + candlestick: { + itemStyle: { + color: '#f3a81a', + color0: '#ffff00', + }, + lineStyle: { + width: 1, + color: '#ffff00', + color0: '#f3a81a', + }, + areaStyle: { + color: '#805500', + color0: '#ffff00' + } + }, + + chord: { + padding: 4, + itemStyle: { + color: '#f3a81a', + borderWidth: 1, + borderColor: 'rgba(128, 128, 128, 0.5)', + }, + lineStyle: { + color: 'rgba(128, 128, 128, 0.5)', + }, + areaStyle: { + color: '#805500', + } + }, + + map: { + itemStyle: { + color: '#ffd11a', + }, + areaStyle: { + color: '#f2be19', + }, + label: { + color: '#ffd11a' + } + }, + + graph: { + itemStyle: { + color: '#001727', + }, + linkStyle: { + color: '#001727' + } + }, + + gauge: { + axisLine: { + lineStyle: { + color: [[0.2, '#f2d71f'],[0.8, '#001727'],[1, '#ffff00']], + width: 8 + } + } + } + }; + + echarts.registerTheme('bee-inspired', theme); +})); \ No newline at end of file diff --git a/theme/blue.js b/theme/blue.js new file mode 100644 index 0000000000..8b92b8098b --- /dev/null +++ b/theme/blue.js @@ -0,0 +1,162 @@ +/* +* Licensed to the Apache Software Foundation (ASF) under one +* or more contributor license agreements. See the NOTICE file +* distributed with this work for additional information +* regarding copyright ownership. The ASF licenses this file +* to you under the Apache License, Version 2.0 (the +* "License"); you may not use this file except in compliance +* with the License. You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, +* software distributed under the License is distributed on an +* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY +* KIND, either express or implied. See the License for the +* specific language governing permissions and limitations +* under the License. +*/ + +(function (root, factory) {if (typeof define === 'function' && define.amd) { + // AMD. Register as an anonymous module. + define(['exports', 'echarts'], factory); + } else if (typeof exports === 'object' && typeof exports.nodeName !== 'string') { + // CommonJS + factory(exports, require('echarts')); + } else { + // Browser globals + factory({}, root.echarts); + } +}(this, function (exports, echarts) { + var log = function (msg) { + if (typeof console !== 'undefined') { + console && console.error && console.error(msg); + } + }; + if (!echarts) { + log('ECharts is not Loaded'); + return; + } + + var colorPalette = [ + '#1790cf','#1bb2d8','#99d2dd','#88b0bb', + '#1c7099','#038cc4','#75abd0','#afd6dd' + ]; + + var theme = { + + color: colorPalette, + + title: { + textStyle: { + fontWeight: 'normal', + color: '#1790cf' + } + }, + + visualMap: { + color:['#1790cf','#a2d4e6'] + }, + + toolbox: { + color: ['#1790cf','#1790cf','#1790cf','#1790cf'] + }, + + tooltip: { + backgroundColor: 'rgba(0,0,0,0.5)', + axisPointer: { // Axis indicator, coordinate trigger effective + type: 'line', // The default is a straight line： 'line' | 'shadow' + lineStyle: { // Straight line indicator style settings + color: '#1790cf', + type: 'dashed' + }, + crossStyle: { + color: '#1790cf' + }, + shadowStyle: { // Shadow indicator style settings + color: 'rgba(200,200,200,0.3)' + } + } + }, + + // Area scaling controller + dataZoom: { + dataBackgroundColor: '#eee', // Data background color + fillerColor: 'rgba(144,197,237,0.2)', // Fill the color + handleColor: '#1790cf' // Handle color + }, + + timeline: { + lineStyle: { + color: '#1790cfa' + }, + controlStyle: { + color: '#1790cf', + borderColor: '#1790cf' + } + }, + + candlestick: { + itemStyle: { + color: '#1bb2d8', + color0: '#99d2dd', + }, + lineStyle: { + width: 1, + color: '#1c7099', + color0: '#88b0bb', + }, + areaStyle: { + color: '#1790cf', + color0: '#1bb2d8' + } + }, + + chord: { + padding: 4, + itemStyle: { + color: '#1bb2d8', + borderWidth: 1, + borderColor: 'rgba(128, 128, 128, 0.5)', + }, + lineStyle: { + color: 'rgba(128, 128, 128, 0.5)', + }, + areaStyle: { + color: '#1790cf', + } + }, + + graph: { + itemStyle: { + color: '#1bb2d8', + }, + linkStyle: { + color: '#88b0bb' + } + }, + + map: { + itemStyle: { + color: '#ddd', + }, + areaStyle: { + color: '99d2dd', + }, + label: { + color: '#c12e34' + } + }, + + gauge: { + axisLine: { + lineStyle: { + color: [[0.2, '#1bb2d8'],[0.8, '#1790cf'],[1, '#1c7099']], + width: 8 + } + } + } + }; + + echarts.registerTheme('blue', theme); +})); \ No newline at end of file diff --git a/theme/caravan.js b/theme/caravan.js new file mode 100644 index 0000000000..7cb736b6dc --- /dev/null +++ b/theme/caravan.js @@ -0,0 +1,162 @@ +/* +* Licensed to the Apache Software Foundation (ASF) under one +* or more contributor license agreements. See the NOTICE file +* distributed with this work for additional information +* regarding copyright ownership. The ASF licenses this file +* to you under the Apache License, Version 2.0 (the +* "License"); you may not use this file except in compliance +* with the License. You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, +* software distributed under the License is distributed on an +* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY +* KIND, either express or implied. See the License for the +* specific language governing permissions and limitations +* under the License. +*/ + +(function (root, factory) {if (typeof define === 'function' && define.amd) { + // AMD. Register as an anonymous module. + define(['exports', 'echarts'], factory); + } else if (typeof exports === 'object' && typeof exports.nodeName !== 'string') { + // CommonJS + factory(exports, require('echarts')); + } else { + // Browser globals + factory({}, root.echarts); + } +}(this, function (exports, echarts) { + var log = function (msg) { + if (typeof console !== 'undefined') { + console && console.error && console.error(msg); + } + }; + if (!echarts) { + log('ECharts is not Loaded'); + return; + } + + var colorPalette = [ + '#fad089','#ff9c5b','#f5634a','#ed303c', + '#3b8183','#f7826e','#faac9e','#fcd5cf' + ]; + + var theme = { + + color: colorPalette, + + title: { + textStyle: { + fontWeight: 'normal', + color: '#fad089' + } + }, + + visualMap: { + color:['#fad089','#a2d4e6'] + }, + + toolbox: { + color: ['#fad089','#fad089','#fad089','#fad089'] + }, + + tooltip: { + backgroundColor: 'rgba(0,0,0,0.5)', + axisPointer: { // Axis indicator, coordinate trigger effective + type: 'line', // The default is a straight line： 'line' | 'shadow' + lineStyle: { // Straight line indicator style settings + color: '#fad089', + type: 'dashed' + }, + crossStyle: { + color: '#fad089' + }, + shadowStyle: { // Shadow indicator style settings + color: 'rgba(200,200,200,0.3)' + } + } + }, + + // Area scaling controller + dataZoom: { + dataBackgroundColor: '#eee', // Data background color + fillerColor: 'rgba(144,197,237,0.2)', // Fill the color + handleColor: '#fad089' // Handle color + }, + + timeline: { + lineStyle: { + color: '#fad089' + }, + controlStyle: { + color: '#fad089', + borderColor: '#fad089' + } + }, + + candlestick: { + itemStyle: { + color: '#ff9c5b', + color0: '#f5634a', + }, + lineStyle: { + width: 1, + color: '#3b8183', + color0: '#ed303c', + }, + areaStyle: { + color: '#fad089', + color0: '#ed303c' + } + }, + + chord: { + padding: 4, + itemStyle: { + color: '#fad089', + borderWidth: 1, + borderColor: 'rgba(128, 128, 128, 0.5)', + }, + lineStyle: { + color: 'rgba(128, 128, 128, 0.5)', + }, + areaStyle: { + color: '#ed303c', + } + }, + + map: { + itemStyle: { + color: '#ddd', + }, + areaStyle: { + color: '#f5634a', + }, + label: { + color: '#c12e34' + } + }, + + graph: { + itemStyle: { + color: '#f5634a', + }, + linkStyle: { + color: '#fad089' + } + }, + + gauge: { + axisLine: { + lineStyle: { + color: [[0.2, '#ff9c5b'],[0.8, '#fad089'],[1, '#3b8183']], + width: 8 + } + } + } + }; + + echarts.registerTheme('caravan', theme); +})); \ No newline at end of file diff --git a/theme/carp.js b/theme/carp.js new file mode 100644 index 0000000000..b0a828b908 --- /dev/null +++ b/theme/carp.js @@ -0,0 +1,147 @@ +/* +* Licensed to the Apache Software Foundation (ASF) under one +* or more contributor license agreements. See the NOTICE file +* distributed with this work for additional information +* regarding copyright ownership. The ASF licenses this file +* to you under the Apache License, Version 2.0 (the +* "License"); you may not use this file except in compliance +* with the License. You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, +* software distributed under the License is distributed on an +* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY +* KIND, either express or implied. See the License for the +* specific language governing permissions and limitations +* under the License. +*/ + +(function (root, factory) {if (typeof define === 'function' && define.amd) { + // AMD. Register as an anonymous module. + define(['exports', 'echarts'], factory); + } else if (typeof exports === 'object' && typeof exports.nodeName !== 'string') { + // CommonJS + factory(exports, require('echarts')); + } else { + // Browser globals + factory({}, root.echarts); + } +}(this, function (exports, echarts) { + var log = function (msg) { + if (typeof console !== 'undefined') { + console && console.error && console.error(msg); + } + }; + if (!echarts) { + log('ECharts is not Loaded'); + return; + } + + var colorPalette = [ + '#f0d8A8','#3d1c00','#86b8b1','#f2d694', + '#fa2a00','#ff8066','#ffd5cc','#f9edd2' + ]; + + var theme = { + + color: colorPalette, + + title: { + textStyle: { + fontWeight: 'normal', + color: '#f0d8A8' + } + }, + + visualMap: { + color:['#f0d8A8','#3d1c00'] + }, + + toolbox: { + color: ['#f0d8A8','#f0d8A8','#f0d8A8','#f0d8A8'] + }, + + tooltip: { + backgroundColor: 'rgba(0,0,0,0.5)', + axisPointer: { // Axis indicator, coordinate trigger effective + type: 'line', // The default is a straight line： 'line' | 'shadow' + lineStyle: { // Straight line indicator style settings + color: '#f0d8A8', + type: 'dashed' + }, + crossStyle: { + color: '#f0d8A8' + }, + shadowStyle: { // Shadow indicator style settings + color: 'rgba(200,200,200,0.3)' + } + } + }, + + // Area scaling controller + dataZoom: { + dataBackgroundColor: '#eee', // Data background color + fillerColor: 'rgba(200,200,200,0.2)', // Fill the color + handleColor: '#f0d8A8' // Handle color + }, + + timeline: { + lineStyle: { + color: '#f0dba8' + }, + controlStyle: { + color: '#f0dba8', + borderColor: '#f0dba8' + } + }, + + candlestick: { + itemStyle: { + color: '#3d1c00', + color0: '#86b8b1', + }, + lineStyle: { + width: 1, + color: '#fa2a00', + color0: '#f2d694', + }, + areaStyle: { + color: '#f0d8A8', + color0: '#86b8b1' + } + }, + + map: { + itemStyle: { + color: '#ddd', + }, + areaStyle: { + color: '#86b8b1', + }, + label: { + color: '#c12e34' + } + }, + + graph: { + itemStyle: { + color: '#3d1c00', + }, + linkStyle: { + color: '#f0d8A8' + } + }, + + gauge: { + axisLine: { + lineStyle: { + color: [[0.2, '#3d1c00'],[0.8, '#f0d8A8'],[1, '#fa2a00']], + width: 8 + } + } + } + }; + + echarts.registerTheme('carp', theme); +})); \ No newline at end of file diff --git a/theme/cool.js b/theme/cool.js new file mode 100644 index 0000000000..72a904eeb6 --- /dev/null +++ b/theme/cool.js @@ -0,0 +1,162 @@ +/* +* Licensed to the Apache Software Foundation (ASF) under one +* or more contributor license agreements. See the NOTICE file +* distributed with this work for additional information +* regarding copyright ownership. The ASF licenses this file +* to you under the Apache License, Version 2.0 (the +* "License"); you may not use this file except in compliance +* with the License. You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, +* software distributed under the License is distributed on an +* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY +* KIND, either express or implied. See the License for the +* specific language governing permissions and limitations +* under the License. +*/ + +(function (root, factory) {if (typeof define === 'function' && define.amd) { + // AMD. Register as an anonymous module. + define(['exports', 'echarts'], factory); + } else if (typeof exports === 'object' && typeof exports.nodeName !== 'string') { + // CommonJS + factory(exports, require('echarts')); + } else { + // Browser globals + factory({}, root.echarts); + } +}(this, function (exports, echarts) { + var log = function (msg) { + if (typeof console !== 'undefined') { + console && console.error && console.error(msg); + } + }; + if (!echarts) { + log('ECharts is not Loaded'); + return; + } + + var colorPalette = [ + '#b21ab4','#6f0099','#2a2073','#0b5ea8','#17aecc', + '#b3b3ff','#eb99ff','#fae6ff','#e6f2ff','#eeeeee' + ]; + + var theme = { + + color: colorPalette, + + title: { + textStyle: { + fontWeight: 'normal', + color: '#00aecd' + } + }, + + visualMap: { + color:['#00aecd','#a2d4e6'] + }, + + toolbox: { + color: ['#00aecd','#00aecd','#00aecd','#00aecd'] + }, + + tooltip: { + backgroundColor: 'rgba(0,0,0,0.5)', + axisPointer: { // Axis indicator, coordinate trigger effective + type: 'line', // The default is a straight line： 'line' | 'shadow' + lineStyle: { // Straight line indicator style settings + color: '#00aecd', + type: 'dashed' + }, + crossStyle: { + color: '#00aecd' + }, + shadowStyle: { // Shadow indicator style settings + color: 'rgba(200,200,200,0.3)' + } + } + }, + + // Area scaling controller + dataZoom: { + dataBackgroundColor: '#eee', // Data background color + fillerColor: 'rgba(144,197,237,0.2)', // Fill the color + handleColor: '#00aecd' // Handle color + }, + + timeline: { + lineStyle: { + color: '#00aecd' + }, + controlStyle: { + color: '#00aecd', + borderColor: '00aecd' + } + }, + + candlestick: { + itemStyle: { + color: '#00aecd', + color0: '#a2d4e6', + }, + lineStyle: { + width: 1, + color: '#00aecd', + color0: '#a2d4e6', + }, + areaStyle: { + color: '#b21ab4', + color0: '#0b5ea8' + } + }, + + chord: { + padding: 4, + itemStyle: { + color: '#b21ab4', + borderWidth: 1, + borderColor: 'rgba(128, 128, 128, 0.5)', + }, + lineStyle: { + color: 'rgba(128, 128, 128, 0.5)', + }, + areaStyle: { + color: '#0b5ea8', + } + }, + + graph: { + itemStyle: { + color: '#b21ab4', + }, + linkStyle: { + color: '#2a2073' + } + }, + + map: { + itemStyle: { + color: '#c12e34', + }, + areaStyle: { + color: '#ddd', + }, + label: { + color: '#c12e34' + } + }, + + gauge: { + axisLine: { + lineStyle: { + color: [[0.2, '#dddddd'],[0.8, '#00aecd'],[1, '#f5ccff']], + width: 8 + } + } + } + }; + + echarts.registerTheme('cool', theme); +})); \ No newline at end of file diff --git a/theme/dark-blue.js b/theme/dark-blue.js new file mode 100644 index 0000000000..679d3b48bf --- /dev/null +++ b/theme/dark-blue.js @@ -0,0 +1,152 @@ +/* +* Licensed to the Apache Software Foundation (ASF) under one +* or more contributor license agreements. See the NOTICE file +* distributed with this work for additional information +* regarding copyright ownership. The ASF licenses this file +* to you under the Apache License, Version 2.0 (the +* "License"); you may not use this file except in compliance +* with the License. You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, +* software distributed under the License is distributed on an +* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY +* KIND, either express or implied. See the License for the +* specific language governing permissions and limitations +* under the License. +*/ + +(function (root, factory) { + if (typeof define === 'function' && define.amd) { + // AMD. Register as an anonymous module. + define(['exports', 'echarts'], factory); + } else if (typeof exports === 'object' && typeof exports.nodeName !== 'string') { + // CommonJS + factory(exports, require('echarts')); + } else { + // Browser globals + factory({}, root.echarts); + } +}(this, function (exports, echarts) { + var log = function (msg) { + if (typeof console !== 'undefined') { + console && console.error && console.error(msg); + } + }; + if (!echarts) { + log('ECharts is not Loaded'); + return; + } + var contrastColor = '#eee'; + var axisCommon = function () { + return { + axisLine: { + lineStyle: { + color: contrastColor + } + }, + axisTick: { + lineStyle: { + color: contrastColor + } + }, + axisLabel: { + textStyle: { + color: contrastColor + } + }, + splitLine: { + lineStyle: { + type: 'dashed', + color: '#aaa' + } + }, + splitArea: { + areaStyle: { + color: contrastColor + } + } + }; + }; + + var colorPalette = ['#00305a','#004b8d','#0074d9','#4192d9','#7abaf2','#99cce6','#d6ebf5','#eeeeee']; + var theme = { + color: colorPalette, + backgroundColor: '#333', + tooltip: { + axisPointer: { + lineStyle: { + color: contrastColor + }, + crossStyle: { + color: contrastColor + } + } + }, + legend: { + textStyle: { + color: contrastColor + } + }, + title: { + textStyle: { + color: contrastColor + } + }, + toolbox: { + iconStyle: { + normal: { + borderColor: contrastColor + } + } + }, + + // Area scaling controller + dataZoom: { + dataBackgroundColor: '#eee', // Data background color + fillerColor: 'rgba(200,200,200,0.2)', // Fill the color + handleColor: '#00305a' // Handle color + }, + + timeline: { + itemStyle: { + color: colorPalette[1] + }, + lineStyle: { + color: contrastColor + }, + controlStyle: { + color: contrastColor, + borderColor: contrastColor + }, + label: { + color: contrastColor + } + }, + + timeAxis: axisCommon(), + logAxis: axisCommon(), + valueAxis: axisCommon(), + categoryAxis: axisCommon(), + + line: { + symbol: 'circle' + }, + graph: { + color: colorPalette + }, + + gauge: { + axisLine: { + lineStyle: { + color: [[0.2, '#004b8d'],[0.8, '#00305a'],[1, '#7abaf2']], + width: 8 + } + } + } + }; + + theme.categoryAxis.splitLine.show = false; + echarts.registerTheme('dark-blue', theme); +})); \ No newline at end of file diff --git a/theme/dark-bold.js b/theme/dark-bold.js new file mode 100644 index 0000000000..1b71811162 --- /dev/null +++ b/theme/dark-bold.js @@ -0,0 +1,152 @@ +/* +* Licensed to the Apache Software Foundation (ASF) under one +* or more contributor license agreements. See the NOTICE file +* distributed with this work for additional information +* regarding copyright ownership. The ASF licenses this file +* to you under the Apache License, Version 2.0 (the +* "License"); you may not use this file except in compliance +* with the License. You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, +* software distributed under the License is distributed on an +* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY +* KIND, either express or implied. See the License for the +* specific language governing permissions and limitations +* under the License. +*/ + +(function (root, factory) { + if (typeof define === 'function' && define.amd) { + // AMD. Register as an anonymous module. + define(['exports', 'echarts'], factory); + } else if (typeof exports === 'object' && typeof exports.nodeName !== 'string') { + // CommonJS + factory(exports, require('echarts')); + } else { + // Browser globals + factory({}, root.echarts); + } +}(this, function (exports, echarts) { + var log = function (msg) { + if (typeof console !== 'undefined') { + console && console.error && console.error(msg); + } + }; + if (!echarts) { + log('ECharts is not Loaded'); + return; + } + var contrastColor = '#eee'; + var axisCommon = function () { + return { + axisLine: { + lineStyle: { + color: contrastColor + } + }, + axisTick: { + lineStyle: { + color: contrastColor + } + }, + axisLabel: { + textStyle: { + color: contrastColor + } + }, + splitLine: { + lineStyle: { + type: 'dashed', + color: '#aaa' + } + }, + splitArea: { + areaStyle: { + color: contrastColor + } + } + }; + }; + + var colorPalette = ['#458c6b','#f2da87','#d9a86c','#d94436','#a62424','#76bc9b','#cce6da','#eeeeee']; + var theme = { + color: colorPalette, + backgroundColor: '#333', + tooltip: { + axisPointer: { + lineStyle: { + color: contrastColor + }, + crossStyle: { + color: contrastColor + } + } + }, + legend: { + textStyle: { + color: contrastColor + } + }, + title: { + textStyle: { + color: contrastColor + } + }, + toolbox: { + iconStyle: { + normal: { + borderColor: contrastColor + } + } + }, + + // Area scaling controller + dataZoom: { + dataBackgroundColor: '#eee', // Data background color + fillerColor: 'rgba(200,200,200,0.2)', // Fill the color + handleColor: '#458c6b' // Handle color + }, + + timeline: { + itemStyle: { + color: colorPalette[1] + }, + lineStyle: { + color: contrastColor + }, + controlStyle: { + color: contrastColor, + borderColor: contrastColor + }, + label: { + color: contrastColor + } + }, + + timeAxis: axisCommon(), + logAxis: axisCommon(), + valueAxis: axisCommon(), + categoryAxis: axisCommon(), + + line: { + symbol: 'circle' + }, + graph: { + color: colorPalette + }, + + gauge: { + axisLine: { + lineStyle: { + color: [[0.2, '#f2da87'],[0.8, '#458c6b'],[1, '#a62424']], + width: 8 + } + } + } + }; + + theme.categoryAxis.splitLine.show = false; + echarts.registerTheme('dark-bold', theme); +})); \ No newline at end of file diff --git a/theme/dark-digerati.js b/theme/dark-digerati.js new file mode 100644 index 0000000000..c458ad46a1 --- /dev/null +++ b/theme/dark-digerati.js @@ -0,0 +1,152 @@ +/* +* Licensed to the Apache Software Foundation (ASF) under one +* or more contributor license agreements. See the NOTICE file +* distributed with this work for additional information +* regarding copyright ownership. The ASF licenses this file +* to you under the Apache License, Version 2.0 (the +* "License"); you may not use this file except in compliance +* with the License. You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, +* software distributed under the License is distributed on an +* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY +* KIND, either express or implied. See the License for the +* specific language governing permissions and limitations +* under the License. +*/ + +(function (root, factory) { + if (typeof define === 'function' && define.amd) { + // AMD. Register as an anonymous module. + define(['exports', 'echarts'], factory); + } else if (typeof exports === 'object' && typeof exports.nodeName !== 'string') { + // CommonJS + factory(exports, require('echarts')); + } else { + // Browser globals + factory({}, root.echarts); + } +}(this, function (exports, echarts) { + var log = function (msg) { + if (typeof console !== 'undefined') { + console && console.error && console.error(msg); + } + }; + if (!echarts) { + log('ECharts is not Loaded'); + return; + } + var contrastColor = '#eee'; + var axisCommon = function () { + return { + axisLine: { + lineStyle: { + color: contrastColor + } + }, + axisTick: { + lineStyle: { + color: contrastColor + } + }, + axisLabel: { + textStyle: { + color: contrastColor + } + }, + splitLine: { + lineStyle: { + type: 'dashed', + color: '#aaa' + } + }, + splitArea: { + areaStyle: { + color: contrastColor + } + } + }; + }; + + var colorPalette = ['#52656b','#ff3b77','#a3cc00','#ffffff','#b8b89f','#ffccdb','#e5ff80','#f4f4f0']; + var theme = { + color: colorPalette, + backgroundColor: '#333', + tooltip: { + axisPointer: { + lineStyle: { + color: contrastColor + }, + crossStyle: { + color: contrastColor + } + } + }, + legend: { + textStyle: { + color: contrastColor + } + }, + title: { + textStyle: { + color: contrastColor + } + }, + toolbox: { + iconStyle: { + normal: { + borderColor: contrastColor + } + } + }, + + // Area scaling controller + dataZoom: { + dataBackgroundColor: '#eee', // Data background color + fillerColor: 'rgba(200,200,200,0.2)', // Fill the color + handleColor: '#52656b' // Handle color + }, + + timeline: { + itemStyle: { + color: colorPalette[1] + }, + lineStyle: { + color: contrastColor + }, + controlStyle: { + color: contrastColor, + borderColor: contrastColor + }, + label: { + color: contrastColor + } + }, + + timeAxis: axisCommon(), + logAxis: axisCommon(), + valueAxis: axisCommon(), + categoryAxis: axisCommon(), + + line: { + symbol: 'circle' + }, + graph: { + color: colorPalette + }, + + gauge: { + axisLine: { + lineStyle: { + color: [[0.2, '#ff3b77'],[0.8, '#52656b'],[1, '#b8b89f']], + width: 8 + } + } + } + }; + + theme.categoryAxis.splitLine.show = false; + echarts.registerTheme('dark-digerati', theme); +})); \ No newline at end of file diff --git a/theme/dark-fresh-cut.js b/theme/dark-fresh-cut.js new file mode 100644 index 0000000000..a7064ec60a --- /dev/null +++ b/theme/dark-fresh-cut.js @@ -0,0 +1,152 @@ +/* +* Licensed to the Apache Software Foundation (ASF) under one +* or more contributor license agreements. See the NOTICE file +* distributed with this work for additional information +* regarding copyright ownership. The ASF licenses this file +* to you under the Apache License, Version 2.0 (the +* "License"); you may not use this file except in compliance +* with the License. You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, +* software distributed under the License is distributed on an +* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY +* KIND, either express or implied. See the License for the +* specific language governing permissions and limitations +* under the License. +*/ + +(function (root, factory) { + if (typeof define === 'function' && define.amd) { + // AMD. Register as an anonymous module. + define(['exports', 'echarts'], factory); + } else if (typeof exports === 'object' && typeof exports.nodeName !== 'string') { + // CommonJS + factory(exports, require('echarts')); + } else { + // Browser globals + factory({}, root.echarts); + } +}(this, function (exports, echarts) { + var log = function (msg) { + if (typeof console !== 'undefined') { + console && console.error && console.error(msg); + } + }; + if (!echarts) { + log('ECharts is not Loaded'); + return; + } + var contrastColor = '#eee'; + var axisCommon = function () { + return { + axisLine: { + lineStyle: { + color: contrastColor + } + }, + axisTick: { + lineStyle: { + color: contrastColor + } + }, + axisLabel: { + textStyle: { + color: contrastColor + } + }, + splitLine: { + lineStyle: { + type: 'dashed', + color: '#aaa' + } + }, + splitArea: { + areaStyle: { + color: contrastColor + } + } + }; + }; + + var colorPalette = ['#00a8c6','#40c0cb','#ebd3ad','#aee239','#8fbe00','#33e0ff','#b3f4ff','#e6ff99']; + var theme = { + color: colorPalette, + backgroundColor: '#333', + tooltip: { + axisPointer: { + lineStyle: { + color: contrastColor + }, + crossStyle: { + color: contrastColor + } + } + }, + legend: { + textStyle: { + color: contrastColor + } + }, + title: { + textStyle: { + color: contrastColor + } + }, + toolbox: { + iconStyle: { + normal: { + borderColor: contrastColor + } + } + }, + + // Area scaling controller + dataZoom: { + dataBackgroundColor: '#eee', // Data background color + fillerColor: 'rgba(200,200,200,0.2)', // Fill the color + handleColor: '#00a8c6' // Handle color + }, + + timeline: { + itemStyle: { + color: colorPalette[1] + }, + lineStyle: { + color: contrastColor + }, + controlStyle: { + color: contrastColor, + borderColor: contrastColor + }, + label: { + color: contrastColor + } + }, + + timeAxis: axisCommon(), + logAxis: axisCommon(), + valueAxis: axisCommon(), + categoryAxis: axisCommon(), + + line: { + symbol: 'circle' + }, + graph: { + color: colorPalette + }, + + gauge: { + axisLine: { + lineStyle: { + color: [[0.2, '#40c0cb'],[0.8, '#00a8c6'],[1, '#8fbe00']], + width: 8 + } + } + } + }; + + theme.categoryAxis.splitLine.show = false; + echarts.registerTheme('dark-fresh-cut', theme); +})); \ No newline at end of file diff --git a/theme/dark-mushroom.js b/theme/dark-mushroom.js new file mode 100644 index 0000000000..f89af6d2b5 --- /dev/null +++ b/theme/dark-mushroom.js @@ -0,0 +1,152 @@ +/* +* Licensed to the Apache Software Foundation (ASF) under one +* or more contributor license agreements. See the NOTICE file +* distributed with this work for additional information +* regarding copyright ownership. The ASF licenses this file +* to you under the Apache License, Version 2.0 (the +* "License"); you may not use this file except in compliance +* with the License. You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, +* software distributed under the License is distributed on an +* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY +* KIND, either express or implied. See the License for the +* specific language governing permissions and limitations +* under the License. +*/ + +(function (root, factory) { + if (typeof define === 'function' && define.amd) { + // AMD. Register as an anonymous module. + define(['exports', 'echarts'], factory); + } else if (typeof exports === 'object' && typeof exports.nodeName !== 'string') { + // CommonJS + factory(exports, require('echarts')); + } else { + // Browser globals + factory({}, root.echarts); + } +}(this, function (exports, echarts) { + var log = function (msg) { + if (typeof console !== 'undefined') { + console && console.error && console.error(msg); + } + }; + if (!echarts) { + log('ECharts is not Loaded'); + return; + } + var contrastColor = '#eee'; + var axisCommon = function () { + return { + axisLine: { + lineStyle: { + color: contrastColor + } + }, + axisTick: { + lineStyle: { + color: contrastColor + } + }, + axisLabel: { + textStyle: { + color: contrastColor + } + }, + splitLine: { + lineStyle: { + type: 'dashed', + color: '#aaa' + } + }, + splitArea: { + areaStyle: { + color: contrastColor + } + } + }; + }; + + var colorPalette = ['#cc0e00','#ff1a0a','#ff8880','#ffc180','#ffc2b0','#ffffff','#ff8880','#ffe6e6']; + var theme = { + color: colorPalette, + backgroundColor: '#333', + tooltip: { + axisPointer: { + lineStyle: { + color: contrastColor + }, + crossStyle: { + color: contrastColor + } + } + }, + legend: { + textStyle: { + color: contrastColor + } + }, + title: { + textStyle: { + color: contrastColor + } + }, + toolbox: { + iconStyle: { + normal: { + borderColor: contrastColor + } + } + }, + + // Area scaling controller + dataZoom: { + dataBackgroundColor: '#eee', // Data background color + fillerColor: 'rgba(200,200,200,0.2)', // Fill the color + handleColor: '#cc0e00' // Handle color + }, + + timeline: { + itemStyle: { + color: colorPalette[1] + }, + lineStyle: { + color: contrastColor + }, + controlStyle: { + color: contrastColor, + borderColor: contrastColor + }, + label: { + color: contrastColor + } + }, + + timeAxis: axisCommon(), + logAxis: axisCommon(), + valueAxis: axisCommon(), + categoryAxis: axisCommon(), + + line: { + symbol: 'circle' + }, + graph: { + color: colorPalette + }, + + gauge: { + axisLine: { + lineStyle: { + color: [[0.2, '#ff1a0a'],[0.8, '#cc0e00'],[1, '#ffc2b0']], + width: 8 + } + } + } + }; + + theme.categoryAxis.splitLine.show = false; + echarts.registerTheme('dark-mushroom', theme); +})); \ No newline at end of file diff --git a/theme/dark.js b/theme/dark.js index e8caaf3166..d185e957ea 100644 --- a/theme/dark.js +++ b/theme/dark.js @@ -1,24 +1,4 @@ -/* -* Licensed to the Apache Software Foundation (ASF) under one -* or more contributor license agreements. See the NOTICE file -* distributed with this work for additional information -* regarding copyright ownership. The ASF licenses this file -* to you under the Apache License, Version 2.0 (the -* "License"); you may not use this file except in compliance -* with the License. You may obtain a copy of the License at -* -* http://www.apache.org/licenses/LICENSE-2.0 -* -* Unless required by applicable law or agreed to in writing, -* software distributed under the License is distributed on an -* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY -* KIND, either express or implied. See the License for the -* specific language governing permissions and limitations -* under the License. -*/ - (function (root, factory) { - /* eslint-disable */ if (typeof define === 'function' && define.amd) { // AMD. Register as an anonymous module. define(['exports', 'echarts'], factory); @@ -29,7 +9,6 @@ // Browser globals factory({}, root.echarts); } - /* eslint-enable */ }(this, function (exports, echarts) { var log = function (msg) { if (typeof console !== 'undefined') { @@ -72,10 +51,7 @@ }; }; - var colorPalette = [ - '#dd6b66', '#759aa0', '#e69d87', '#8dc1a9', '#ea7e53', - '#eedd78', '#73a373', '#73b9bc', '#7289ab', '#91ca8c', '#f49f42' - ]; + var colorPalette = ['#dd6b66','#759aa0','#e69d87','#8dc1a9','#ea7e53','#eedd78','#73a373','#73b9bc','#7289ab', '#91ca8c','#f49f42']; var theme = { color: colorPalette, backgroundColor: '#333', @@ -94,9 +70,6 @@ color: contrastColor } }, - textStyle: { - color: contrastColor - }, title: { textStyle: { color: contrastColor @@ -109,39 +82,30 @@ } } }, - dataZoom: { - textStyle: { + + // Area scaling controller + dataZoom: { + dataBackgroundColor: '#eee', // Data background color + fillerColor: 'rgba(200,200,200,0.2)', // Fill the color + handleColor: '#dd6b66' // Handle color + }, + + timeline: { + itemStyle: { + color: colorPalette[1] + }, + lineStyle: { color: contrastColor - } - }, - visualMap: { - textStyle: { + }, + controlStyle: { + color: contrastColor, + borderColor: contrastColor + }, + label: { color: contrastColor - } - }, - timeline: { - lineStyle: { - color: contrastColor - }, - itemStyle: { - normal: { - color: colorPalette[1] - } - }, - label: { - normal: { - textStyle: { - color: contrastColor - } - } - }, - controlStyle: { - normal: { - color: contrastColor, - borderColor: contrastColor - } - } - }, + } + }, + timeAxis: axisCommon(), logAxis: axisCommon(), valueAxis: axisCommon(), @@ -153,24 +117,27 @@ graph: { color: colorPalette }, + gauge: { - title: { - textStyle: { - color: contrastColor - } - } + axisLine: { + lineStyle: { + color: [[0.2, '#dd6b66'],[0.8, '#759aa0'],[1, '#ea7e53']], + width: 8 + } + } + } }, + candlestick: { itemStyle: { - normal: { color: '#FD1050', color0: '#0CF49B', borderColor: '#FD1050', borderColor0: '#0CF49B' - } } } }; + theme.categoryAxis.splitLine.show = false; echarts.registerTheme('dark', theme); })); \ No newline at end of file diff --git a/theme/eduardo.js b/theme/eduardo.js new file mode 100644 index 0000000000..42b695a925 --- /dev/null +++ b/theme/eduardo.js @@ -0,0 +1,162 @@ +/* +* Licensed to the Apache Software Foundation (ASF) under one +* or more contributor license agreements. See the NOTICE file +* distributed with this work for additional information +* regarding copyright ownership. The ASF licenses this file +* to you under the Apache License, Version 2.0 (the +* "License"); you may not use this file except in compliance +* with the License. You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, +* software distributed under the License is distributed on an +* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY +* KIND, either express or implied. See the License for the +* specific language governing permissions and limitations +* under the License. +*/ + +(function (root, factory) {if (typeof define === 'function' && define.amd) { + // AMD. Register as an anonymous module. + define(['exports', 'echarts'], factory); + } else if (typeof exports === 'object' && typeof exports.nodeName !== 'string') { + // CommonJS + factory(exports, require('echarts')); + } else { + // Browser globals + factory({}, root.echarts); + } +}(this, function (exports, echarts) { + var log = function (msg) { + if (typeof console !== 'undefined') { + console && console.error && console.error(msg); + } + }; + if (!echarts) { + log('ECharts is not Loaded'); + return; + } + + var colorPalette = [ + '#59535e','#e7dcef','#f1baf3','#5d4970', + '#372049','#c0b2cd','#ffccff','#f2f0f5' + ]; + + var theme = { + + color: colorPalette, + + title: { + textStyle: { + fontWeight: 'normal', + color: '#59535e' + } + }, + + visualMap: { + color:['#59535e','#e7dcef'] + }, + + toolbox: { + color: ['#59535e','#59535e','#59535e','#59535e'] + }, + + tooltip: { + backgroundColor: 'rgba(0,0,0,0.5)', + axisPointer: { // Axis indicator, coordinate trigger effective + type: 'line', // The default is a straight line： 'line' | 'shadow' + lineStyle: { // Straight line indicator style settings + color: '#59535e', + type: 'dashed' + }, + crossStyle: { + color: '#59535e' + }, + shadowStyle : { // Shadow indicator style settings + color: 'rgba(200,200,200,0.3)' + } + } + }, + + // Area scaling controller + dataZoom: { + dataBackgroundColor: '#eee', // Data background color + fillerColor: 'rgba(200,200,200,0.2)', // Fill the color + handleColor: '#59535e' // Handle color + }, + + timeline: { + lineStyle: { + color: '#59535e' + }, + controlStyle: { + color: '#59535e', + borderColor: '#59535e' + } + }, + + candlestick: { + itemStyle: { + color: '#e7dcef', + color0: '#f1baf3', + }, + lineStyle: { + width: 1, + color: '#372049', + color0: '#5d4970', + }, + areaStyle: { + color: '#59535e', + color0: '#e7dcef' + } + }, + + chord: { + padding: 4, + itemStyle: { + color: '#59535e', + borderWidth: 1, + borderColor: 'rgba(128, 128, 128, 0.5)', + }, + lineStyle: { + color: 'rgba(128, 128, 128, 0.5)', + }, + areaStyle: { + color: '#e7dcef', + } + }, + + map: { + itemStyle: { + color: '#ddd', + }, + areaStyle: { + color: '#f1baf3', + }, + label: { + color: '#c12e34' + } + }, + + graph: { + itemStyle: { + color: '#59535e', + }, + linkStyle: { + color: '#59535e' + } + }, + + gauge: { + axisLine: { + lineStyle: { + color: [[0.2, '#e7dcef'],[0.8, '#59535e'],[1, '#372049']], + width: 8 + } + } + } + }; + + echarts.registerTheme('eduardo', theme); +})); \ No newline at end of file diff --git a/theme/forest.js b/theme/forest.js new file mode 100644 index 0000000000..2cedbcce00 --- /dev/null +++ b/theme/forest.js @@ -0,0 +1,147 @@ +/* +* Licensed to the Apache Software Foundation (ASF) under one +* or more contributor license agreements. See the NOTICE file +* distributed with this work for additional information +* regarding copyright ownership. The ASF licenses this file +* to you under the Apache License, Version 2.0 (the +* "License"); you may not use this file except in compliance +* with the License. You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, +* software distributed under the License is distributed on an +* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY +* KIND, either express or implied. See the License for the +* specific language governing permissions and limitations +* under the License. +*/ + +(function (root, factory) {if (typeof define === 'function' && define.amd) { + // AMD. Register as an anonymous module. + define(['exports', 'echarts'], factory); + } else if (typeof exports === 'object' && typeof exports.nodeName !== 'string') { + // CommonJS + factory(exports, require('echarts')); + } else { + // Browser globals + factory({}, root.echarts); + } +}(this, function (exports, echarts) { + var log = function (msg) { + if (typeof console !== 'undefined') { + console && console.error && console.error(msg); + } + }; + if (!echarts) { + log('ECharts is not Loaded'); + return; + } + + var colorPalette = [ + '#313b23','#494f2b','#606233','#d6b77b', + '#0e0e0e','#076278','#808080','#e7d5b1' + ]; + + var theme = { + + color: colorPalette, + + title: { + textStyle: { + fontWeight: 'normal', + color: '#313b23' + } + }, + + visualMap: { + color:['#313b23','#494f2b'] + }, + + toolbox: { + color: ['#313b23','#313b23','#313b23','#313b23'] + }, + + tooltip: { + backgroundColor: 'rgba(0,0,0,0.5)', + axisPointer : { // Axis indicator, coordinate trigger effective + type: 'line', // The default is a straight line： 'line' | 'shadow' + lineStyle: { // Straight line indicator style settings + color: '#313b23', + type: 'dashed' + }, + crossStyle: { + color: '#313b23' + }, + shadowStyle : { // Shadow indicator style settings + color: 'rgba(200,200,200,0.3)' + } + } + }, + + // Area scaling controller + dataZoom: { + dataBackgroundColor: '#eee', // Data background color + fillerColor: 'rgba(200,200,200,0.2)', // Fill the color + handleColor: '#313b23' // Handle color + }, + + timeline: { + lineStyle: { + color: '#313b23' + }, + controlStyle: { + color: '#313b23', + borderColor: '#313b23' + } + }, + + candlestick: { + itemStyle: { + color: '#494f2b', + color0: '#606233', + }, + lineStyle: { + width: 1, + color: '#0e0e0e', + color0: '#d6b77b', + }, + areaStyle: { + color: '#494f2b', + color0: '#d6b77b' + } + }, + + map: { + itemStyle: { + color: '#606233', + }, + areaStyle: { + color: '#ddd', + }, + label: { + color: '#c12e34' + } + }, + + graph: { + itemStyle: { + color: '#494f2b', + }, + linkStyle: { + color: '#313b23' + } + }, + + gauge: { + axisLine: { + lineStyle: { + color: [[0.2, '#494f2b'],[0.8, '#313b23'],[1, '0e0e0e']], + width: 8 + } + } + } + }; + + echarts.registerTheme('forest', theme); +})); \ No newline at end of file diff --git a/theme/fresh-cut.js b/theme/fresh-cut.js new file mode 100644 index 0000000000..82f040fd0f --- /dev/null +++ b/theme/fresh-cut.js @@ -0,0 +1,147 @@ +/* +* Licensed to the Apache Software Foundation (ASF) under one +* or more contributor license agreements. See the NOTICE file +* distributed with this work for additional information +* regarding copyright ownership. The ASF licenses this file +* to you under the Apache License, Version 2.0 (the +* "License"); you may not use this file except in compliance +* with the License. You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, +* software distributed under the License is distributed on an +* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY +* KIND, either express or implied. See the License for the +* specific language governing permissions and limitations +* under the License. +*/ + +(function (root, factory) {if (typeof define === 'function' && define.amd) { + // AMD. Register as an anonymous module. + define(['exports', 'echarts'], factory); + } else if (typeof exports === 'object' && typeof exports.nodeName !== 'string') { + // CommonJS + factory(exports, require('echarts')); + } else { + // Browser globals + factory({}, root.echarts); + } +}(this, function (exports, echarts) { + var log = function (msg) { + if (typeof console !== 'undefined') { + console && console.error && console.error(msg); + } + }; + if (!echarts) { + log('ECharts is not Loaded'); + return; + } + + var colorPalette = [ + '#00a8c6','#40c0cb','#f0dec2','#aee239', + '#8fbe00','#33e0ff','#b3f4ff','#e6ff99' + ]; + + var theme = { + + color: colorPalette, + + title: { + textStyle: { + fontWeight: 'normal', + color: '#00a8c6' + } + }, + + visualMap: { + color:['#00a8c6','#a2d4e6'] + }, + + toolbox: { + color: ['#00a8c6','#00a8c6','#00a8c6','#00a8c6'] + }, + + tooltip: { + backgroundColor: 'rgba(0,0,0,0.5)', + axisPointer: { // Axis indicator, coordinate trigger effective + type: 'line', // The default is a straight line： 'line' | 'shadow' + lineStyle: { // Straight line indicator style settings + color: '#00a8c6', + type: 'dashed' + }, + crossStyle: { + color: '#00a8c6' + }, + shadowStyle : { // Shadow indicator style settings + color: 'rgba(200,200,200,0.3)' + } + } + }, + + // Area scaling controller + dataZoom: { + dataBackgroundColor: '#eee', // Data background color + fillerColor: 'rgba(144,197,237,0.2)', // Fill the color + handleColor: '#00a8c6' // Handle color + }, + + timeline: { + lineStyle: { + color: '#00a8c6' + }, + controlStyle: { + color: '#00a8c6', + borderColor: '#00a8c6' + } + }, + + candlestick: { + itemStyle: { + color: '#40c0cb', + color0: '#f0dec2', + }, + lineStyle: { + width: 1, + color: '#8fbe00', + color0: '#aee239', + }, + areaStyle: { + color: '#00a8c6', + color0: '#aee239' + } + }, + + map: { + itemStyle: { + color: '#ddd', + }, + areaStyle: { + color: '#f0dec2', + }, + label: { + color: '#c12e34' + } + }, + + graph: { + itemStyle: { + color: '#f0dec2', + }, + linkStyle: { + color: '#00a8c6' + } + }, + + gauge: { + axisLine: { + lineStyle: { + color: [[0.2, '#40c0cb'],[0.8, '#00a8c6'],[1, '#8fbe00']], + width: 8 + } + } + } + }; + + echarts.registerTheme('fresh-cut', theme); +})); \ No newline at end of file diff --git a/theme/fruit.js b/theme/fruit.js new file mode 100644 index 0000000000..38972f9805 --- /dev/null +++ b/theme/fruit.js @@ -0,0 +1,162 @@ +/* +* Licensed to the Apache Software Foundation (ASF) under one +* or more contributor license agreements. See the NOTICE file +* distributed with this work for additional information +* regarding copyright ownership. The ASF licenses this file +* to you under the Apache License, Version 2.0 (the +* "License"); you may not use this file except in compliance +* with the License. You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, +* software distributed under the License is distributed on an +* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY +* KIND, either express or implied. See the License for the +* specific language governing permissions and limitations +* under the License. +*/ + +(function (root, factory) {if (typeof define === 'function' && define.amd) { + // AMD. Register as an anonymous module. + define(['exports', 'echarts'], factory); + } else if (typeof exports === 'object' && typeof exports.nodeName !== 'string') { + // CommonJS + factory(exports, require('echarts')); + } else { + // Browser globals + factory({}, root.echarts); + } +}(this, function (exports, echarts) { + var log = function (msg) { + if (typeof console !== 'undefined') { + console && console.error && console.error(msg); + } + }; + if (!echarts) { + log('ECharts is not Loaded'); + return; + } + + var colorPalette = [ + '#ffcb6a','#ffa850','#ffe2c4','#e5834e', + '#ffb081','#f7826e','#faac9e','#fcd5cf' + ]; + + var theme = { + + color: colorPalette, + + title: { + textStyle: { + fontWeight: 'normal', + color: '#ffcb6a' + } + }, + + visualMap: { + color:['#ffcb6a','#ffa850'] + }, + + toolbox: { + color : ['#ffcb6a','#ffcb6a','#ffcb6a','#ffcb6a'] + }, + + tooltip: { + backgroundColor: 'rgba(0,0,0,0.5)', + axisPointer: { // Axis indicator, coordinate trigger effective + type: 'line', // The default is a straight line： 'line' | 'shadow' + lineStyle: { // Straight line indicator style settings + color: '#ffcb6a', + type: 'dashed' + }, + crossStyle: { + color: '#ffcb6a' + }, + shadowStyle : { // Shadow indicator style settings + color: 'rgba(200,200,200,0.3)' + } + } + }, + + // Area scaling controller + dataZoom: { + dataBackgroundColor: '#eee', // Data background color + fillerColor: 'rgba(200,200,200,0.2)', // Fill the color + handleColor: '#ffcb6a' // Handle color + }, + + timeline: { + lineStyle: { + color: '#ffcb6a' + }, + controlStyle: { + color: '#ffcb6a', + borderColor: '#ffcb6a' + } + }, + + candlestick: { + itemStyle: { + color: '#ffa850', + color0: '#ffe2c4', + }, + lineStyle: { + width: 1, + color: '#ffb081', + color0: '#e5834e', + }, + areaStyle: { + color: '#e5834e', + color0: '#fcd5cf' + } + }, + + chord: { + padding: 4, + itemStyle: { + color: '#fcd5cf', + borderWidth: 1, + borderColor: 'rgba(128, 128, 128, 0.5)', + }, + lineStyle: { + color: 'rgba(128, 128, 128, 0.5)', + }, + areaStyle: { + color: '#e5834e', + } + }, + + map: { + itemStyle: { + color: '#ffe2c4', + }, + areaStyle: { + color: '#ddd', + }, + label: { + color: '#c12e34' + } + }, + + graph: { + itemStyle: { + color: '#f2385a', + }, + linkStyle: { + color: '#ffcb6a' + } + }, + + gauge: { + axisLine: { + lineStyle: { + color: [[0.2, '#ffa850'],[0.8, '#ffcb6a'],[1, '#ffb081']], + width: 8 + } + } + } + }; + + echarts.registerTheme('fruit', theme); +})); \ No newline at end of file diff --git a/theme/gray.js b/theme/gray.js new file mode 100644 index 0000000000..c8aa5bf2eb --- /dev/null +++ b/theme/gray.js @@ -0,0 +1,198 @@ +/* +* Licensed to the Apache Software Foundation (ASF) under one +* or more contributor license agreements. See the NOTICE file +* distributed with this work for additional information +* regarding copyright ownership. The ASF licenses this file +* to you under the Apache License, Version 2.0 (the +* "License"); you may not use this file except in compliance +* with the License. You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, +* software distributed under the License is distributed on an +* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY +* KIND, either express or implied. See the License for the +* specific language governing permissions and limitations +* under the License. +*/ + +(function (root, factory) {if (typeof define === 'function' && define.amd) { + // AMD. Register as an anonymous module. + define(['exports', 'echarts'], factory); + } else if (typeof exports === 'object' && typeof exports.nodeName !== 'string') { + // CommonJS + factory(exports, require('echarts')); + } else { + // Browser globals + factory({}, root.echarts); + } +}(this, function (exports, echarts) { + var log = function (msg) { + if (typeof console !== 'undefined') { + console && console.error && console.error(msg); + } + }; + if (!echarts) { + log('ECharts is not Loaded'); + return; + } + + var colorPalette = [ + '#757575','#c7c7c7','#dadada', + '#8b8b8b','#b5b5b5','#e9e9e9' + ]; + + var theme = { + + color: colorPalette, + + title: { + textStyle: { + fontWeight: 'normal', + color: '#757575' + } + }, + + dataRange: { + color: ['#636363','#dcdcdc'] + }, + + toolbox: { + color: ['#757575','#757575','#757575','#757575'] + }, + + tooltip: { + backgroundColor: 'rgba(0,0,0,0.5)', + axisPointer: { // Axis indicator, coordinate trigger effective + type: 'line', // The default is a straight line： 'line' | 'shadow' + lineStyle: { // Straight line indicator style settings + color: '#757575', + type: 'dashed' + }, + crossStyle: { + color: '#757575' + }, + shadowStyle: { // Shadow indicator style settings + color: 'rgba(200,200,200,0.3)' + } + } + }, + + // Area scaling controller + dataZoom: { + dataBackgroundColor: '#eee', // Data background color + fillerColor: 'rgba(117,117,117,0.2)', // Fill the color + handleColor: '#757575' // Handle color + }, + + grid: { + borderWidth: 0 + }, + + categoryAxis: { + axisLine: { // Coordinate axis + lineStyle: { // Property 'lineStyle' controls line styles + color: '#757575' + } + }, + splitLine: { // Separation line + lineStyle: { // Property 'lineStyle' (see lineStyle) controls line styles + color: ['#eee'] + } + } + }, + + valueAxis: { + axisLine: { // Coordinate axis + lineStyle: { // Property 'lineStyle' controls line styles + color: '#757575' + } + }, + splitArea : { + show: true, + areaStyle: { + color: ['rgba(250,250,250,0.1)','rgba(200,200,200,0.1)'] + } + }, + splitLine: { // Separation line + lineStyle: { // Property 'lineStyle' (see lineStyle) controls line styles + color: ['#eee'] + } + } + }, + + timeline: { + lineStyle: { + color: '#757575' + }, + controlStyle: { + color: '#757575', + borderColor: '#757575' + } + }, + + candlestick: { + itemStyle: { + color: '#8b8b8b', + color0: '#dadada', + }, + lineStyle: { + width: 1, + color: '#757575', + color0: '#c7c7c7', + }, + areaStyle: { + color: '#757575', + color0: '#e9e9e9' + } + }, + + map: { + itemStyle: { + color: '#c7c7c7', + }, + areaStyle: { + color: 'ddd', + }, + label: { + color: '#c12e34' + } + }, + + graph: { + itemStyle: { + color: '#e9e9e9', + }, + linkStyle: { + color: '#757575' + } + }, + + chord: { + padding: 4, + itemStyle: { + color: '#e9e9e9', + borderWidth: 1, + borderColor: 'rgba(128, 128, 128, 0.5)', + }, + lineStyle: { + color: 'rgba(128, 128, 128, 0.5)', + }, + areaStyle: { + color: '#757575', + } + }, + + gauge: { + axisLine: { + lineStyle: { + color: [[0.2, '#b5b5b5'],[0.8, '#757575'],[1, '#5c5c5c']], + width: 8 + } + } + } + }; + + echarts.registerTheme('gray', theme); +})); \ No newline at end of file diff --git a/theme/green.js b/theme/green.js new file mode 100644 index 0000000000..c73d5379df --- /dev/null +++ b/theme/green.js @@ -0,0 +1,198 @@ +/* +* Licensed to the Apache Software Foundation (ASF) under one +* or more contributor license agreements. See the NOTICE file +* distributed with this work for additional information +* regarding copyright ownership. The ASF licenses this file +* to you under the Apache License, Version 2.0 (the +* "License"); you may not use this file except in compliance +* with the License. You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, +* software distributed under the License is distributed on an +* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY +* KIND, either express or implied. See the License for the +* specific language governing permissions and limitations +* under the License. +*/ + +(function (root, factory) {if (typeof define === 'function' && define.amd) { + // AMD. Register as an anonymous module. + define(['exports', 'echarts'], factory); + } else if (typeof exports === 'object' && typeof exports.nodeName !== 'string') { + // CommonJS + factory(exports, require('echarts')); + } else { + // Browser globals + factory({}, root.echarts); + } +}(this, function (exports, echarts) { + var log = function (msg) { + if (typeof console !== 'undefined') { + console && console.error && console.error(msg); + } + }; + if (!echarts) { + log('ECharts is not Loaded'); + return; + } + + var colorPalette = [ + '#408829','#68a54a','#a9cba2','#86b379', + '#397b29','#8abb6f','#759c6a','#bfd3b7' + ]; + + var theme = { + + color: colorPalette, + + title: { + textStyle: { + fontWeight: 'normal', + color: '#408829' + } + }, + + visualMap: { + color:['408829','#a9cba2'] + }, + + toolbox: { + color: ['#408829','#408829','#408829','#408829'] + }, + + tooltip: { + backgroundColor: 'rgba(0,0,0,0.5)', + axisPointer: { // Axis indicator, coordinate trigger effective + type: 'line', // The default is a straight line： 'line' | 'shadow' + lineStyle: { // Straight line indicator style settings + color: '#408829', + type: 'dashed' + }, + crossStyle: { + color: '#408829' + }, + shadowStyle : { // Shadow indicator style settings + color: 'rgba(200,200,200,0.3)' + } + } + }, + + // Area scaling controller + dataZoom: { + dataBackgroundColor: '#eee', // Data background color + fillerColor: 'rgba(64,136,41,0.2)', // Fill the color + handleColor: '#408829' // Handle color + }, + + grid: { + borderWidth: 0 + }, + + categoryAxis: { + axisLine: { // Coordinate axis + lineStyle: { // Property 'lineStyle' controls line styles + color: '#408829' + } + }, + splitLine: { // Separation line + lineStyle: { // Property 'lineStyle' (see lineStyle) controls line styles + color: ['#eee'] + } + } + }, + + valueAxis: { + axisLine: { // Coordinate axis + lineStyle: { // Property 'lineStyle' controls line styles + color: '#408829' + } + }, + splitArea: { + show: true, + areaStyle: { + color: ['rgba(250,250,250,0.1)','rgba(200,200,200,0.1)'] + } + }, + splitLine: { // Separation line + lineStyle: { // Property 'lineStyle' (see lineStyle) controls line styles + color: ['#eee'] + } + } + }, + + timeline: { + lineStyle: { + color: '#408829' + }, + controlStyle: { + color: '#408829', + borderColor: '#408829' + } + }, + + candlestick: { + itemStyle: { + color: '#68a54a', + color0: '#a9cba2', + }, + lineStyle: { + width: 1, + color: '#408829', + color0: '#86b379', + }, + areaStyle: { + color: '#408829', + color0: '#bfd3b7' + } + }, + + graph: { + itemStyle: { + color: '#bfd3b7', + }, + linkStyle: { + color: '#408829' + } + }, + + chord: { + padding: 4, + itemStyle: { + color: '#bfd3b7', + borderWidth: 1, + borderColor: 'rgba(128, 128, 128, 0.5)', + }, + lineStyle: { + color: 'rgba(128, 128, 128, 0.5)', + }, + areaStyle: { + color: '#408829', + } + }, + + map: { + itemStyle: { + color: '#ddd', + }, + areaStyle: { + color: '#408829', + }, + label: { + color: '#000' + } + }, + + gauge: { + axisLine: { + lineStyle: { + color: [[0.2, '#86b379'],[0.8, '#68a54a'],[1, '#408829']], + width: 8 + } + } + } + }; + + echarts.registerTheme('green', theme); +})); \ No newline at end of file diff --git a/theme/helianthus.js b/theme/helianthus.js new file mode 100644 index 0000000000..ac4513b011 --- /dev/null +++ b/theme/helianthus.js @@ -0,0 +1,229 @@ +/* +* Licensed to the Apache Software Foundation (ASF) under one +* or more contributor license agreements. See the NOTICE file +* distributed with this work for additional information +* regarding copyright ownership. The ASF licenses this file +* to you under the Apache License, Version 2.0 (the +* "License"); you may not use this file except in compliance +* with the License. You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, +* software distributed under the License is distributed on an +* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY +* KIND, either express or implied. See the License for the +* specific language governing permissions and limitations +* under the License. +*/ + +(function (root, factory) {if (typeof define === 'function' && define.amd) { + // AMD. Register as an anonymous module. + define(['exports', 'echarts'], factory); + } else if (typeof exports === 'object' && typeof exports.nodeName !== 'string') { + // CommonJS + factory(exports, require('echarts')); + } else { + // Browser globals + factory({}, root.echarts); + } +}(this, function (exports, echarts) { + var log = function (msg) { + if (typeof console !== 'undefined') { + console && console.error && console.error(msg); + } + }; + if (!echarts) { + log('ECharts is not Loaded'); + return; + } + + var colorPalette = [ + '#44B7D3','#E42B6D','#F4E24E','#FE9616','#8AED35', + '#ff69b4','#ba55d3','#cd5c5c','#ffa500','#40e0d0', + '#E95569','#ff6347','#7b68ee','#00fa9a','#ffd700', + '#6699FF','#ff6666','#3cb371','#b8860b','#30e0e0' + ]; + + var theme = { + + color: colorPalette, + + title: { + textStyle: { + fontWeight: 'normal', + color: '#8A826D' + } + }, + + dataRange: { + x:'right', + y:'center', + itemWidth: 5, + itemHeight:25, + color:['#E42B6D','#F9AD96'], + text:['High','Low'], // Text, default is numeric text + textStyle: { + color: '#8A826D' // Range text color + } + }, + + toolbox: { + color: ['#E95569','#E95569','#E95569','#E95569'], + effectiveColor: '#ff4500', + itemGap: 8 + }, + + tooltip: { + backgroundColor: 'rgba(138,130,109,0.7)', // Prompt background color, default is black with a transparency of 0.7 + axisPointer: { // Axis indicator, coordinate trigger effective + type: 'line', // The default is a straight line： 'line' | 'shadow' + lineStyle: { // Straight line indicator style settings + color: '#6B6455', + type: 'dashed' + }, + crossStyle: { + color: '#A6A299' + }, + shadowStyle : { // Shadow indicator style settings + color: 'rgba(200,200,200,0.3)' + } + } + }, + + // Area scaling controller + dataZoom: { + dataBackgroundColor: 'rgba(130,197,209,0.6)', // Data background color + fillerColor: 'rgba(233,84,105,0.1)', // Fill the color + handleColor: 'rgba(107,99,84,0.8)' // Handle color + }, + + grid: { + borderWidth:0 + }, + + categoryAxis: { + axisLine: { // Coordinate axis + lineStyle: { // Property 'lineStyle' controls line styles + color: '#6B6455' + } + }, + splitLine: { // separate line + show: false + } + }, + + valueAxis: { + axisLine: { // Coordinate axis + show: true + }, + splitArea : { + show: false + }, + splitLine: { // separate line + lineStyle: { // Property 'lineStyle' controls line styles + color: ['#FFF'], + type: 'dashed' + } + } + }, + + polar : { + axisLine: { // Coordinate axis + lineStyle: { // // Property 'lineStyle' controls line styles + color: '#ddd' + } + }, + splitArea : { + show : true, + areaStyle : { + color: ['rgba(250,250,250,0.2)','rgba(200,200,200,0.2)'] + } + }, + splitLine : { + lineStyle : { + color : '#ddd' + } + } + }, + + timeline: { + lineStyle: { + color: '#6B6455' + }, + controlStyle: { + color: '#6B6455', + borderColor: '#6B6455' + } + }, + + line: { + smooth : true, + symbol: 'emptyCircle', // Inflection point graphic type + symbolSize: 3 // Inflection point graphic size + }, + + candlestick: { + itemStyle: { + color: '#e42B6d', + color0: '#44B7d3', + }, + lineStyle: { + width: 1, + color: '#e42B6d', + color0: '#44B7d3', + }, + areaStyle: { + color: '#fe994e', + color0: '#e42B6d' + } + }, + + map: { + itemStyle: { + color: '#6b6455', + }, + areaStyle: { + color: '#ddd', + }, + label: { + color: '#e42B6d' + } + }, + + graph: { + itemStyle: { + color: '#e42B6d', + }, + linkStyle: { + color: '#6b6455' + } + }, + + chord: { + padding: 4, + itemStyle: { + color: '#e42B6d', + borderWidth: 1, + borderColor: 'rgba(128, 128, 128, 0.5)', + }, + lineStyle: { + color: 'rgba(128, 128, 128, 0.5)', + }, + areaStyle: { + color: '#6b6455', + } + }, + + gauge: { + axisLine: { + lineStyle: { + color: [[0.2, '#44B7D3'],[0.8, '#6B6455'],[1, '#E42B6D']], + width: 8 + } + } + } + }; + + echarts.registerTheme('helianthus', theme); +})); \ No newline at end of file diff --git a/theme/infographic.js b/theme/infographic.js index 226909c880..4683617c94 100644 --- a/theme/infographic.js +++ b/theme/infographic.js @@ -1,22 +1,3 @@ -/* -* Licensed to the Apache Software Foundation (ASF) under one -* or more contributor license agreements. See the NOTICE file -* distributed with this work for additional information -* regarding copyright ownership. The ASF licenses this file -* to you under the Apache License, Version 2.0 (the -* "License"); you may not use this file except in compliance -* with the License. You may obtain a copy of the License at -* -* http://www.apache.org/licenses/LICENSE-2.0 -* -* Unless required by applicable law or agreed to in writing, -* software distributed under the License is distributed on an -* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY -* KIND, either express or implied. See the License for the -* specific language governing permissions and limitations -* under the License. -*/ - (function (root, factory) {if (typeof define === 'function' && define.amd) { // AMD. Register as an anonymous module. define(['exports', 'echarts'], factory); @@ -116,28 +97,27 @@ } }, - timeline: { - lineStyle: { + timeline: { + itemStyle: { + color: '#27727B' + }, + lineStyle: { color: '#27727B' - }, - controlStyle: { - normal: { + }, + controlStyle: { color: '#27727B', borderColor: '#27727B' - } - }, + }, symbol: 'emptyCircle', symbolSize: 3 - }, + }, line: { itemStyle: { - normal: { borderWidth:2, borderColor:'#fff', lineStyle: { width: 3 - } }, emphasis: { borderWidth:0 @@ -147,47 +127,44 @@ symbolSize: 3.5 }, - candlestick: { - itemStyle: { - normal: { - color: '#C1232B', - color0: '#B5C334', - lineStyle: { - width: 1, - color: '#C1232B', - color0: '#B5C334' - } - } - } - }, - - graph: { - color: colorPalette - }, - - map: { - label: { - normal: { - textStyle: { - color: '#C1232B' - } - }, - emphasis: { - textStyle: { - color: 'rgb(100,0,0)' - } - } - }, - itemStyle: { - normal: { - areaColor: '#ddd', - borderColor: '#eee' - }, - emphasis: { - areaColor: '#fe994e' - } - } - }, + candlestick: { + itemStyle: { + color: '#c1232b', + color0: '#b5c334', + }, + lineStyle: { + width: 1, + color: '#c1232b', + color0: '#b5c334', + }, + areaStyle: { + color: '#c1232b', + color0: '#27727b' + } + }, + + graph: { + itemStyle: { + color: '#c1232b', + }, + linkStyle: { + color: '#b5c334' + } + }, + + map: { + itemStyle: { + color: '#f2385a', + areaColor: '#ddd', + borderColor: '#eee' + }, + areaStyle: { + color: '#fe994e', + }, + label: { + color: '#c1232b' + } + }, gauge: { axisLine: { diff --git a/theme/inspired.js b/theme/inspired.js new file mode 100644 index 0000000000..f3693e0e65 --- /dev/null +++ b/theme/inspired.js @@ -0,0 +1,147 @@ +/* +* Licensed to the Apache Software Foundation (ASF) under one +* or more contributor license agreements. See the NOTICE file +* distributed with this work for additional information +* regarding copyright ownership. The ASF licenses this file +* to you under the Apache License, Version 2.0 (the +* "License"); you may not use this file except in compliance +* with the License. You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, +* software distributed under the License is distributed on an +* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY +* KIND, either express or implied. See the License for the +* specific language governing permissions and limitations +* under the License. +*/ + +(function (root, factory) {if (typeof define === 'function' && define.amd) { + // AMD. Register as an anonymous module. + define(['exports', 'echarts'], factory); + } else if (typeof exports === 'object' && typeof exports.nodeName !== 'string') { + // CommonJS + factory(exports, require('echarts')); + } else { + // Browser globals + factory({}, root.echarts); + } +}(this, function (exports, echarts) { + var log = function (msg) { + if (typeof console !== 'undefined') { + console && console.error && console.error(msg); + } + }; + if (!echarts) { + log('ECharts is not Loaded'); + return; + } + + var colorPalette = [ + '#cc0000','#002266','#ff9900','#006600', + '#8a150f','#076278','#808080','#f07b75' + ]; + + var theme = { + + color: colorPalette, + + title: { + textStyle: { + fontWeight: 'normal', + color: '#cc0000' + } + }, + + visualMap: { + color:['#cc0000','#002266'] + }, + + toolbox: { + color: ['#cc0000','#cc0000','#cc0000','#cc0000'] + }, + + tooltip: { + backgroundColor: 'rgba(0,0,0,0.5)', + axisPointer: { // Axis indicator, coordinate trigger effective + type: 'line', // The default is a straight line： 'line' | 'shadow' + lineStyle: { // Straight line indicator style settings + color: '#cc0000', + type: 'dashed' + }, + crossStyle: { + color: '#cc0000' + }, + shadowStyle : { // Shadow indicator style settings + color: 'rgba(200,200,200,0.3)' + } + } + }, + + // Area scaling controller + dataZoom: { + dataBackgroundColor: '#eee', // Data background color + fillerColor: 'rgba(200,200,200,0.2)', // Fill the color + handleColor: '#cc0000' // Handle color + }, + + timeline: { + lineStyle: { + color: '#cc0000' + }, + controlStyle: { + color: '#cc0000', + borderColor: '#cc0000' + } + }, + + candlestick: { + itemStyle: { + color: '#002266', + color0: '#ff9900', + }, + lineStyle: { + width: 1, + color: '#8a150f', + color0: '#006600', + }, + areaStyle: { + color: '#cc0000', + color0: '#ff9900' + } + }, + + map: { + itemStyle: { + color: '#ff9900', + }, + areaStyle: { + color: '#ddd', + }, + label: { + color: '#c12e34' + } + }, + + graph: { + itemStyle: { + color: '#ff9900', + }, + linkStyle: { + color: '#cc0000' + } + }, + + gauge: { + axisLine: { + lineStyle: { + color: [[0.2, '#002266'],[0.8, '#cc0000'],[1, '8a150f']], + width: 8 + } + } + } + }; + + echarts.registerTheme('inspired', theme); +})); \ No newline at end of file diff --git a/theme/jazz.js b/theme/jazz.js new file mode 100644 index 0000000000..6bc6d93f5f --- /dev/null +++ b/theme/jazz.js @@ -0,0 +1,147 @@ +/* +* Licensed to the Apache Software Foundation (ASF) under one +* or more contributor license agreements. See the NOTICE file +* distributed with this work for additional information +* regarding copyright ownership. The ASF licenses this file +* to you under the Apache License, Version 2.0 (the +* "License"); you may not use this file except in compliance +* with the License. You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, +* software distributed under the License is distributed on an +* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY +* KIND, either express or implied. See the License for the +* specific language governing permissions and limitations +* under the License. +*/ + +(function (root, factory) {if (typeof define === 'function' && define.amd) { + // AMD. Register as an anonymous module. + define(['exports', 'echarts'], factory); + } else if (typeof exports === 'object' && typeof exports.nodeName !== 'string') { + // CommonJS + factory(exports, require('echarts')); + } else { + // Browser globals + factory({}, root.echarts); + } +}(this, function (exports, echarts) { + var log = function (msg) { + if (typeof console !== 'undefined') { + console && console.error && console.error(msg); + } + }; + if (!echarts) { + log('ECharts is not Loaded'); + return; + } + + var colorPalette = [ + '#e9e0d1','#91a398','#33605a','#070001', + '#68462b','#58a79c','#abd3ce','#eef6f5' + ]; + + var theme = { + + color: colorPalette, + + title: { + textStyle: { + fontWeight: 'normal', + color: '#e9e0d1' + } + }, + + visualMap: { + color:['#e9e0d1','#91a398'] + }, + + toolbox: { + color : ['#e9e0d1','#e9e0d1','#e9e0d1','#e9e0d1'] + }, + + tooltip: { + backgroundColor: 'rgba(0,0,0,0.5)', + axisPointer: { // Axis indicator, coordinate trigger effective + type: 'line', // The default is a straight line： 'line' | 'shadow' + lineStyle: { // Straight line indicator style settings + color: '#e9e0d1', + type: 'dashed' + }, + crossStyle: { + color: '#e9e0d1' + }, + shadowStyle : { // Shadow indicator style settings + color: 'rgba(200,200,200,0.3)' + } + } + }, + + // Area scaling controller + dataZoom: { + dataBackgroundColor: '#eee', // Data background color + fillerColor: 'rgba(200,200,200,0.2)', // Fill the color + handleColor: '#e9e0d1' // Handle color + }, + + timeline: { + lineStyle: { + color: '#e9e0d1' + }, + controlStyle: { + color: '#e9e0d1', + borderColor: '#e9e0d1' + } + }, + + candlestick: { + itemStyle: { + color: '#91a398', + color0: '#33605a', + }, + lineStyle: { + width: 1, + color: '#68462b', + color0: '#070001', + }, + areaStyle: { + color: '#91a398', + color0: '#abd3ce' + } + }, + + map: { + itemStyle: { + color: '#c12e34', + }, + areaStyle: { + color: '#ddd', + }, + label: { + color: '#c12e34' + } + }, + + graph: { + itemStyle: { + color: '#33605a', + }, + linkStyle: { + color: '#e9e0d1' + } + }, + + gauge: { + axisLine: { + lineStyle: { + color: [[0.2, '#91a398'],[0.8, '#e9e0d1'],[1, '#68462b']], + width: 8 + } + } + } + }; + + echarts.registerTheme('jazz', theme); +})); \ No newline at end of file diff --git a/theme/london.js b/theme/london.js new file mode 100644 index 0000000000..97dc2b0f07 --- /dev/null +++ b/theme/london.js @@ -0,0 +1,147 @@ +/* +* Licensed to the Apache Software Foundation (ASF) under one +* or more contributor license agreements. See the NOTICE file +* distributed with this work for additional information +* regarding copyright ownership. The ASF licenses this file +* to you under the Apache License, Version 2.0 (the +* "License"); you may not use this file except in compliance +* with the License. You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, +* software distributed under the License is distributed on an +* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY +* KIND, either express or implied. See the License for the +* specific language governing permissions and limitations +* under the License. +*/ + +(function (root, factory) {if (typeof define === 'function' && define.amd) { + // AMD. Register as an anonymous module. + define(['exports', 'echarts'], factory); + } else if (typeof exports === 'object' && typeof exports.nodeName !== 'string') { + // CommonJS + factory(exports, require('echarts')); + } else { + // Browser globals + factory({}, root.echarts); + } +}(this, function (exports, echarts) { + var log = function (msg) { + if (typeof console !== 'undefined') { + console && console.error && console.error(msg); + } + }; + if (!echarts) { + log('ECharts is not Loaded'); + return; + } + + var colorPalette = [ + '#02151a','#043a47','#087891','#c8c8c8', + '#b31d14','#0b9cc1','#f2f2f2','#f07b75' + ]; + + var theme = { + + color: colorPalette, + + title: { + textStyle: { + fontWeight: 'normal', + color: '#02151a' + } + }, + + visualMap: { + color: ['#02151a','#a2d4e6'] + }, + + toolbox: { + color: ['#02151a','#02151a','#02151a','#02151a'] + }, + + tooltip: { + backgroundColor: 'rgba(0,0,0,0.5)', + axisPointer: { // Axis indicator, coordinate trigger effective + type: 'line', // The default is a straight line： 'line' | 'shadow' + lineStyle: { // Straight line indicator style settings + color: '#02151a', + type: 'dashed' + }, + crossStyle: { + color: '#02151a' + }, + shadowStyle : { // Shadow indicator style settings + color: 'rgba(200,200,200,0.3)' + } + } + }, + + // Area scaling controller + dataZoom: { + dataBackgroundColor: '#eee', // Data background color + fillerColor: 'rgba(144,197,237,0.2)', // Fill the color + handleColor: '#02151a' // Handle color + }, + + timeline: { + lineStyle: { + color: '#02151a' + }, + controlStyle: { + color: '#02151a', + borderColor: '#02151a' + } + }, + + candlestick: { + itemStyle: { + color: '#043a47', + color0: '#087891', + }, + lineStyle: { + width: 1, + color: '#b31d14', + color0: '#c8c8c8', + }, + areaStyle: { + color: '#087891', + color0: '#c8c8c8' + } + }, + + map: { + itemStyle: { + color: '#ddd', + }, + areaStyle: { + color: '#087891', + }, + label: { + color: '#c12e34' + } + }, + + graph: { + itemStyle: { + color: '#c12e34', + }, + linkStyle: { + color: '#02151a' + } + }, + + gauge: { + axisLine: { + lineStyle: { + color: [[0.2, '#043a47'],[0.8, '#02151a'],[1, '#b31d14']], + width: 8 + } + } + } + }; + + echarts.registerTheme('london', theme); +})); \ No newline at end of file diff --git a/theme/macarons.js b/theme/macarons.js index 978105227b..826e33d258 100644 --- a/theme/macarons.js +++ b/theme/macarons.js @@ -1,22 +1,3 @@ -/* -* Licensed to the Apache Software Foundation (ASF) under one -* or more contributor license agreements. See the NOTICE file -* distributed with this work for additional information -* regarding copyright ownership. The ASF licenses this file -* to you under the Apache License, Version 2.0 (the -* "License"); you may not use this file except in compliance -* with the License. You may obtain a copy of the License at -* -* http://www.apache.org/licenses/LICENSE-2.0 -* -* Unless required by applicable law or agreed to in writing, -* software distributed under the License is distributed on an -* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY -* KIND, either express or implied. See the License for the -* specific language governing permissions and limitations -* under the License. -*/ - (function (root, factory) { if (typeof define === 'function' && define.amd) { // AMD. Register as an anonymous module. @@ -72,15 +53,15 @@ tooltip: { backgroundColor: 'rgba(50,50,50,0.5)', - axisPointer : { - type : 'line', - lineStyle : { + axisPointer: { + type: 'line', + lineStyle: { color: '#008acd' }, crossStyle: { color: '#008acd' }, - shadowStyle : { + shadowStyle: { color: 'rgba(200,200,200,0.2)' } } @@ -115,9 +96,9 @@ color: '#008acd' } }, - splitArea : { - show : true, - areaStyle : { + splitArea: { + show: true, + areaStyle: { color: ['rgba(250,250,250,0.1)','rgba(200,200,200,0.1)'] } }, @@ -128,66 +109,67 @@ } }, - timeline : { - lineStyle : { - color : '#008acd' - }, - controlStyle : { - normal : { color : '#008acd'}, - emphasis : { color : '#008acd'} - }, - symbol : 'emptyCircle', - symbolSize : 3 - }, + timeline: { + lineStyle: { + color: '#008acd' + }, + controlStyle: { + color: '#008acd', + borderColor: '#008acd' + }, + symbol: 'emptyCircle', + symbolSize: 3 + }, line: { - smooth : true, + smooth: true, symbol: 'emptyCircle', symbolSize: 3 }, - candlestick: { - itemStyle: { - normal: { - color: '#d87a80', - color0: '#2ec7c9', - lineStyle: { - color: '#d87a80', - color0: '#2ec7c9' - } - } - } - }, + candlestick: { + itemStyle: { + color: '#d87a80', + color0: '#2ec7c9', + }, + lineStyle: { + width: 1, + color: '#d87a80', + color0: '#2ec7c9', + }, + areaStyle: { + color: '#2ec7c9', + color0: '#b6a2de' + } + }, scatter: { symbol: 'circle', symbolSize: 4 }, - map: { - label: { - normal: { - textStyle: { - color: '#d87a80' - } - } - }, - itemStyle: { - normal: { - borderColor: '#eee', - areaColor: '#ddd' - }, - emphasis: { - areaColor: '#fe994e' - } - } - }, - - graph: { - color: colorPalette - }, + map: { + itemStyle: { + color: '#ddd', + }, + areaStyle: { + color: '#fe994e', + }, + label: { + color: '#d87a80' + } + }, + + graph: { + itemStyle: { + color: '#d87a80', + }, + linkStyle: { + color: '#2ec7c9' + } + }, - gauge : { + gauge: { axisLine: { lineStyle: { color: [[0.2, '#2ec7c9'],[0.8, '#5ab1ef'],[1, '#d87a80']], @@ -196,19 +178,19 @@ }, axisTick: { splitNumber: 10, - length :15, + length: 15, lineStyle: { color: 'auto' } }, splitLine: { - length :22, + length: 22, lineStyle: { color: 'auto' } }, - pointer : { - width : 5 + pointer: { + width: 5 } } }; diff --git a/theme/macarons2.js b/theme/macarons2.js new file mode 100644 index 0000000000..e43c02ed4b --- /dev/null +++ b/theme/macarons2.js @@ -0,0 +1,228 @@ +/* +* Licensed to the Apache Software Foundation (ASF) under one +* or more contributor license agreements. See the NOTICE file +* distributed with this work for additional information +* regarding copyright ownership. The ASF licenses this file +* to you under the Apache License, Version 2.0 (the +* "License"); you may not use this file except in compliance +* with the License. You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, +* software distributed under the License is distributed on an +* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY +* KIND, either express or implied. See the License for the +* specific language governing permissions and limitations +* under the License. +*/ + +(function (root, factory) { + if (typeof define === 'function' && define.amd) { + // AMD. Register as an anonymous module. + define(['exports', 'echarts'], factory); + } else if (typeof exports === 'object' && typeof exports.nodeName !== 'string') { + // CommonJS + factory(exports, require('echarts')); + } else { + // Browser globals + factory({}, root.echarts); + } +}(this, function (exports, echarts) { + var log = function (msg) { + if (typeof console !== 'undefined') { + console && console.error && console.error(msg); + } + }; + if (!echarts) { + log('ECharts is not Loaded'); + return; + } + + var colorPalette = ['#ed9678','#e7dac9','#cb8e85','#f3f39d','#c8e49c', + '#f16d7a','#f3d999','#d3758f','#dcc392','#2e4783', + '#82b6e9','#ff6347','#a092f1','#0a915d','#eaf889', + '#6699FF','#ff6666','#3cb371','#d5b158','#38b6b6' + ]; + + + var theme = { + color: colorPalette, + + title: { + textStyle: { + fontWeight: 'normal', + color: '#cb8e85' + } + }, + + dataRange: { + color:['#cb8e85','#e7dac9'],//颜色 + //text:['高','低'], // 文本，默认为数值文本 + textStyle: { + color: '#333' // 值域文字颜色 + } + }, + + bar: { + barMinHeight: 0, // 最小高度改为0 + // barWidth: null, // 默认自适应 + barGap: '30%', // 柱间距离，默认为柱形宽度的30%，可设固定值 + barCategoryGap : '20%', // 类目间柱形距离，默认为类目间距的20%，可设固定值 + itemStyle: { + normal: { + // color: '各异', + barBorderColor: '#fff', // 柱条边线 + barBorderRadius: 0, // 柱条边线圆角，单位px，默认为0 + barBorderWidth: 1, // 柱条边线线宽，单位px，默认为1 + label: { + show: false + // position: 默认自适应，水平布局为'top'，垂直布局为'right'，可选为 + // 'inside'|'left'|'right'|'top'|'bottom' + // textStyle: null // 默认使用全局文本样式，详见TEXTSTYLE + } + }, + emphasis: { + // color: '各异', + barBorderColor: 'rgba(0,0,0,0)', // 柱条边线 + barBorderRadius: 0, // 柱条边线圆角，单位px，默认为0 + barBorderWidth: 1, // 柱条边线线宽，单位px，默认为1 + label: { + show: false + // position: 默认自适应，水平布局为'top'，垂直布局为'right'，可选为 + // 'inside'|'left'|'right'|'top'|'bottom' + // textStyle: null // 默认使用全局文本样式，详见TEXTSTYLE + } + } + } + }, + + line: { + itemStyle: { + normal: { + // color: 各异, + label: { + show: false + // position: 默认自适应，水平布局为'top'，垂直布局为'right'，可选为 + // 'inside'|'left'|'right'|'top'|'bottom' + // textStyle: null // 默认使用全局文本样式，详见TEXTSTYLE + }, + lineStyle: { + width: 2, + type: 'solid', + shadowColor: 'rgba(0,0,0,0)', //默认透明 + shadowBlur: 5, + shadowOffsetX: 3, + shadowOffsetY: 3 + } + }, + emphasis: { + // color: 各异, + label: { + show: false + // position: 默认自适应，水平布局为'top'，垂直布局为'right'，可选为 + // 'inside'|'left'|'right'|'top'|'bottom' + // textStyle: null // 默认使用全局文本样式，详见TEXTSTYLE + } + } + }, + //smooth : false, + //symbol: null, // 拐点图形类型 + symbolSize: 2, // 拐点图形大小 + //symbolRotate : null, // 拐点图形旋转控制 + showAllSymbol: false // 标志图形默认只有主轴显示（随主轴标签间隔隐藏策略） + }, + + candlestick: { + itemStyle: { + color: '#fe9778', + color0: '#e7dac9', + }, + lineStyle: { + width: 1, + color: '#f78766', + color0: '#f1ccb8', + }, + areaStyle: { + color: '#e7dac9', + color0: '#c8e49c' + } + }, + + // 饼图默认参数 + pie: { + center: ['50%', '50%'], // 默认全局居中 + radius: [0, '75%'], + clockWise: false, // 默认逆时针 + startAngle: 90, + minAngle: 0, // 最小角度改为0 + selectedOffset: 10, // 选中是扇区偏移量 + itemStyle: { + normal: { + // color: 各异, + borderColor: '#fff', + borderWidth: 1, + label: { + show: true, + position: 'outer', + textStyle: {color: '#1b1b1b'}, + lineStyle: {color: '#1b1b1b'} + // textStyle: null // 默认使用全局文本样式，详见TEXTSTYLE + }, + labelLine: { + show: true, + length: 20, + lineStyle: { + // color: 各异, + width: 1, + type: 'solid' + } + } + } + } + }, + + map: { + itemStyle: { + color: '#ddd', + borderColor: '#fff', + borderWidth: 1, + }, + areaStyle: { + color: '#f3f39d', + }, + label: { + show: false, + color: 'rgba(139,69,19,1)' + }, + showLegendSymbol: true + }, + + graph: { + itemStyle: { + color: '#d87a80', + }, + linkStyle: { + strokeColor: '#a17e6e' + }, + nodeStyle: { + brushType: 'both', + strokeColor: '#a17e6e' + }, + label: { + show: false + } + }, + + gauge: { + axisLine: { + lineStyle: { + color: [[0.2, '#ed9678'],[0.8, '#e7dac9'],[1, '#cb8e85']], + width: 8 + } + } + } + }; + + echarts.registerTheme('macarons2', theme); +})); \ No newline at end of file diff --git a/theme/mint.js b/theme/mint.js new file mode 100644 index 0000000000..d6146d6f53 --- /dev/null +++ b/theme/mint.js @@ -0,0 +1,137 @@ +/* +* Licensed to the Apache Software Foundation (ASF) under one +* or more contributor license agreements. See the NOTICE file +* distributed with this work for additional information +* regarding copyright ownership. The ASF licenses this file +* to you under the Apache License, Version 2.0 (the +* "License"); you may not use this file except in compliance +* with the License. You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, +* software distributed under the License is distributed on an +* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY +* KIND, either express or implied. See the License for the +* specific language governing permissions and limitations +* under the License. +*/ + +(function (root, factory) {if (typeof define === 'function' && define.amd) { + // AMD. Register as an anonymous module. + define(['exports', 'echarts'], factory); + } else if (typeof exports === 'object' && typeof exports.nodeName !== 'string') { + // CommonJS + factory(exports, require('echarts')); + } else { + // Browser globals + factory({}, root.echarts); + } +}(this, function (exports, echarts) { + var log = function (msg) { + if (typeof console !== 'undefined') { + console && console.error && console.error(msg); + } + }; + if (!echarts) { + log('ECharts is not Loaded'); + return; + } + + var colorPalette = [ + '#8aedd5','#93bc9e','#cef1db','#7fe579','#a6d7c2', + '#bef0bb','#99e2vb','#94f8a8','#7de5b8','#4dfb70' + ]; + + var theme = { + + color: colorPalette, + + title: { + textStyle: { + fontWeight: 'normal', + color: '#8aedd5' + } + }, + + toolbox: { + color: ['#8aedd5','#8aedd5','#8aedd5','#8aedd5'] + }, + + tooltip: { + backgroundColor: 'rgba(0,0,0,0.5)', + axisPointer: { // Axis indicator, coordinate trigger effective + type: 'line', // The default is a straight line： 'line' | 'shadow' + lineStyle: { // Straight line indicator style settings + color: '#8aedd5', + type: 'dashed' + }, + crossStyle: { + color: '#8aedd5' + }, + shadowStyle: { // Shadow indicator style settings + color: 'rgba(200,200,200,0.3)' + } + } + }, + + // Area scaling controller + dataZoom: { + dataBackgroundColor: '#eee', // Data background color + fillerColor: 'rgba(64,136,41,0.2)', // Fill the color + handleColor: '#408829' // Handle color + }, + + dataRange: { + color:['#93bc92','#bef0bb'] + }, + + candlestick: { + itemStyle: { + color: '#8aedd5', + color0: '#7fe579', + }, + lineStyle: { + width: 1, + color: '#8aedd5', + color0: '#7fe579', + }, + areaStyle: { + color: '#8aedd5', + color0: '#93bc9e' + } + }, + + graph: { + itemStyle: { + color: '#8aedd5', + }, + linkStyle: { + color: '#93bc9e' + } + }, + + map: { + itemStyle: { + color: '#8aedd5', + }, + areaStyle: { + color: '#93bc9e', + }, + label: { + color: '#cef1db' + } + }, + + gauge: { + axisLine: { + lineStyle: { + color: [[0.2, '#93bc9e'],[0.8, '#8aedd5'],[1, '#a6d7c2']], + width: 8 + } + } + } + }; + + echarts.registerTheme('mint', theme); +})); \ No newline at end of file diff --git a/theme/red-velvet.js b/theme/red-velvet.js new file mode 100644 index 0000000000..15c465afc0 --- /dev/null +++ b/theme/red-velvet.js @@ -0,0 +1,147 @@ +/* +* Licensed to the Apache Software Foundation (ASF) under one +* or more contributor license agreements. See the NOTICE file +* distributed with this work for additional information +* regarding copyright ownership. The ASF licenses this file +* to you under the Apache License, Version 2.0 (the +* "License"); you may not use this file except in compliance +* with the License. You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, +* software distributed under the License is distributed on an +* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY +* KIND, either express or implied. See the License for the +* specific language governing permissions and limitations +* under the License. +*/ + +(function (root, factory) {if (typeof define === 'function' && define.amd) { + // AMD. Register as an anonymous module. + define(['exports', 'echarts'], factory); + } else if (typeof exports === 'object' && typeof exports.nodeName !== 'string') { + // CommonJS + factory(exports, require('echarts')); + } else { + // Browser globals + factory({}, root.echarts); + } +}(this, function (exports, echarts) { + var log = function (msg) { + if (typeof console !== 'undefined') { + console && console.error && console.error(msg); + } + }; + if (!echarts) { + log('ECharts is not Loaded'); + return; + } + + var colorPalette = [ + '#8b1a2d','#a7314b','#e6004c','#ff8066', + '#8e5c4e','#ff1a66','#d6c582','#f0d4af' + ]; + + var theme = { + + color: colorPalette, + + title: { + textStyle: { + fontWeight: 'normal', + color: '#8b1a2d' + } + }, + + visualMap: { + color:['#8b1a2d','#a7314b'] + }, + + toolbox: { + color: ['#8b1a2d','#8b1a2d','#8b1a2d','#8b1a2d'] + }, + + tooltip: { + backgroundColor: 'rgba(0,0,0,0.5)', + axisPointer: { // Axis indicator, coordinate trigger effective + type : 'line', // The default is a straight line： 'line' | 'shadow' + lineStyle : { // Straight line indicator style settings + color: '#8b1a2d', + type: 'dashed' + }, + crossStyle: { + color: '#8b1a2d' + }, + shadowStyle : { // Shadow indicator style settings + color: 'rgba(200,200,200,0.3)' + } + } + }, + + // Area scaling controller + dataZoom: { + dataBackgroundColor: '#eee', // Data background color + fillerColor: 'rgba(200,200,200,0.2)', // Fill the color + handleColor: '#8b1a2d' // Handle color + }, + + timeline: { + lineStyle: { + color: '#8b1a2d' + }, + controlStyle: { + color: '#8b1a2d', + borderColor: '#8b1a2d' + } + }, + + candlestick: { + itemStyle: { + color: '#a7314b', + color0: '#d6c582', + }, + lineStyle: { + width: 1, + color: '#8e5c4e', + color0: '#f0d4af', + }, + areaStyle: { + color: '#8b1a2d', + color0: '#ff8066' + } + }, + + map: { + itemStyle: { + color: '#8b1a2d', + }, + areaStyle: { + color: '#ff8066', + }, + label: { + color: '#c12e34' + } + }, + + graph: { + itemStyle: { + color: '#ff8066', + }, + linkStyle: { + color: '#8b1a2d' + } + }, + + gauge: { + axisLine: { + lineStyle: { + color: [[0.2, '#a7314b'],[0.8, '#8b1a2d'],[1, '#8e5c4e']], + width: 8 + } + } + } + }; + + echarts.registerTheme('red-velvet', theme); +})); \ No newline at end of file diff --git a/theme/red.js b/theme/red.js new file mode 100644 index 0000000000..fd163573bf --- /dev/null +++ b/theme/red.js @@ -0,0 +1,202 @@ +/* +* Licensed to the Apache Software Foundation (ASF) under one +* or more contributor license agreements. See the NOTICE file +* distributed with this work for additional information +* regarding copyright ownership. The ASF licenses this file +* to you under the Apache License, Version 2.0 (the +* "License"); you may not use this file except in compliance +* with the License. You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, +* software distributed under the License is distributed on an +* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY +* KIND, either express or implied. See the License for the +* specific language governing permissions and limitations +* under the License. +*/ + +(function (root, factory) {if (typeof define === 'function' && define.amd) { + // AMD. Register as an anonymous module. + define(['exports', 'echarts'], factory); + } else if (typeof exports === 'object' && typeof exports.nodeName !== 'string') { + // CommonJS + factory(exports, require('echarts')); + } else { + // Browser globals + factory({}, root.echarts); + } +}(this, function (exports, echarts) { + var log = function (msg) { + if (typeof console !== 'undefined') { + console && console.error && console.error(msg); + } + }; + if (!echarts) { + log('ECharts is not Loaded'); + return; + } + + var colorPalette = [ + '#d8361b','#f16b4c','#f7b4a9','#d26666', + '#99311c','#c42703','#d07e75' + ]; + + var theme = { + + color: colorPalette, + + title: { + textStyle: { + fontWeight: 'normal', + color: '#d8361b' + } + }, + + visualMap: { + color:['#d8361b','#ffd2d2'] + }, + + dataRange: { + color: ['#bd0707','#ffd2d2'] + }, + + toolbox: { + color: ['#d8361b','#d8361b','#d8361b','#d8361b'] + }, + + tooltip: { + backgroundColor: 'rgba(0,0,0,0.5)', + axisPointer: { // Axis indicator, coordinate trigger effective + type: 'line', // The default is a straight line： 'line' | 'shadow' + lineStyle: { // Straight line indicator style settings + color: '#d8361b', + type: 'dashed' + }, + crossStyle: { + color: '#d8361b' + }, + shadowStyle: { // Shadow indicator style settings + color: 'rgba(200,200,200,0.3)' + } + } + }, + + // Area scaling controller + dataZoom: { + dataBackgroundColor: '#eee', // Data background color + fillerColor: 'rgba(216,54,27,0.2)', // Fill the color + handleColor: '#d8361b' // Handle color + }, + + grid: { + borderWidth: 0 + }, + + categoryAxis: { + axisLine: { // Coordinate axis + lineStyle: { // Property 'lineStyle' controls line styles + color: '#d8361b' + } + }, + splitLine: { // Separation line + lineStyle: { // Property 'lineStyle' (see lineStyle) controls line styles + color: ['#eee'] + } + } + }, + + valueAxis: { + axisLine: { // Coordinate axis + lineStyle: { // Property 'lineStyle' controls line styles + color: '#d8361b' + } + }, + splitArea: { + show: true, + areaStyle: { + color: ['rgba(250,250,250,0.1)','rgba(200,200,200,0.1)'] + } + }, + splitLine: { // Separation line + lineStyle: { // Property 'lineStyle' (see lineStyle) controls line styles + color: ['#eee'] + } + } + }, + + timeline: { + lineStyle: { + color: '#d8361b' + }, + controlStyle: { + color: '#d8361b', + borderColor: '#d8361b' + } + }, + + candlestick: { + itemStyle: { + color: '#f16b4c', + color0: '#f7b4a9', + }, + lineStyle: { + width: 1, + color: '#d8361b', + color0: '#d26666', + }, + areaStyle: { + color: '#d8361b', + color0: '#d07e75' + } + }, + + graph: { + itemStyle: { + color: '#d07e75', + }, + linkStyle: { + color: '#d8361b' + } + }, + + chord: { + padding: 4, + itemStyle: { + color: '#d07e75', + borderWidth: 1, + borderColor: 'rgba(128, 128, 128, 0.5)', + }, + lineStyle: { + color: 'rgba(128, 128, 128, 0.5)', + }, + areaStyle: { + color: '#d8361b', + } + }, + + map: { + itemStyle: { + color: '#d8361b', + }, + areaStyle: { + color: '#d07e75', + }, + label: { + color: '#c12e34' + } + }, + + gauge: { + axisLine: { + lineStyle: { + color: [[0.2, '#f16b4c'],[0.8, '#d8361b'],[1, '#99311c']], + width: 8 + } + } + } + }; + + echarts.registerTheme('red', theme); +})); \ No newline at end of file diff --git a/theme/roma.js b/theme/roma.js index 8500ee806b..93c1d1f733 100644 --- a/theme/roma.js +++ b/theme/roma.js @@ -1,22 +1,3 @@ -/* -* Licensed to the Apache Software Foundation (ASF) under one -* or more contributor license agreements. See the NOTICE file -* distributed with this work for additional information -* regarding copyright ownership. The ASF licenses this file -* to you under the Apache License, Version 2.0 (the -* "License"); you may not use this file except in compliance -* with the License. You may obtain a copy of the License at -* -* http://www.apache.org/licenses/LICENSE-2.0 -* -* Unless required by applicable law or agreed to in writing, -* software distributed under the License is distributed on an -* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY -* KIND, either express or implied. See the License for the -* specific language governing permissions and limitations -* under the License. -*/ - (function (root, factory) {if (typeof define === 'function' && define.amd) { // AMD. Register as an anonymous module. define(['exports', 'echarts'], factory); @@ -54,23 +35,30 @@ } }, - candlestick: { - itemStyle: { - normal: { - color: '#e01f54', - color0: '#001852', - lineStyle: { - width: 1, - color: '#f5e8c8', - color0: '#b8d2c7' - } - } - } - }, + candlestick: { + itemStyle: { + color: '#e01f54', + color0: '#001852', + }, + lineStyle: { + width: 1, + color: '#f5e8c8', + color0: '#b8d2c7', + }, + areaStyle: { + color: '#a4d8c2', + color0: '#f3d999' + } + }, - graph: { - color: colorPalette - }, + graph: { + itemStyle: { + color: '#a4d8c2', + }, + linkStyle: { + color: '#f3d999' + } + }, gauge : { axisLine: { diff --git a/theme/royal.js b/theme/royal.js new file mode 100644 index 0000000000..34422910b2 --- /dev/null +++ b/theme/royal.js @@ -0,0 +1,147 @@ +/* +* Licensed to the Apache Software Foundation (ASF) under one +* or more contributor license agreements. See the NOTICE file +* distributed with this work for additional information +* regarding copyright ownership. The ASF licenses this file +* to you under the Apache License, Version 2.0 (the +* "License"); you may not use this file except in compliance +* with the License. You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, +* software distributed under the License is distributed on an +* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY +* KIND, either express or implied. See the License for the +* specific language governing permissions and limitations +* under the License. +*/ + +(function (root, factory) {if (typeof define === 'function' && define.amd) { + // AMD. Register as an anonymous module. + define(['exports', 'echarts'], factory); + } else if (typeof exports === 'object' && typeof exports.nodeName !== 'string') { + // CommonJS + factory(exports, require('echarts')); + } else { + // Browser globals + factory({}, root.echarts); + } +}(this, function (exports, echarts) { + var log = function (msg) { + if (typeof console !== 'undefined') { + console && console.error && console.error(msg); + } + }; + if (!echarts) { + log('ECharts is not Loaded'); + return; + } + + var colorPalette = [ + '#3f7ea6','#993366','#408000','#8c6f56', + '#a65149','#731f17','#adc2eb','#d9c3b0', + ]; + + var theme = { + + color: colorPalette, + + title: { + textStyle: { + fontWeight: 'normal', + color: '#3f7ea6' + } + }, + + visualMap: { + color: ['#3f7ea6','#993366'] + }, + + toolbox: { + color: ['#3f7ea6','#3f7ea6','#3f7ea6','#3f7ea6'] + }, + + tooltip: { + backgroundColor: 'rgba(0,0,0,0.5)', + axisPointer: { // Axis indicator, coordinate trigger effective + type: 'line', // The default is a straight line： 'line' | 'shadow' + lineStyle: { // Straight line indicator style settings + color: '#3f7ea6', + type: 'dashed' + }, + crossStyle: { + color: '#3f7ea6' + }, + shadowStyle : { // Shadow indicator style settings + color: 'rgba(200,200,200,0.3)' + } + } + }, + + // Area scaling controller + dataZoom: { + dataBackgroundColor: '#eee', // Data background color + fillerColor: 'rgba(200,200,200,0.2)', // Fill the color + handleColor: '#3f7ea6' // Handle color + }, + + timeline: { + lineStyle: { + color: '#3f7ea6' + }, + controlStyle: { + color: '#3f7ea6', + borderColor: '#3f7ea6' + } + }, + + candlestick: { + itemStyle: { + color: '#d9c3b0', + color0: '#8c6f56', + }, + lineStyle: { + width: 1, + color: '#731f17', + color0: '#a65149', + }, + areaStyle: { + color: '#3f7ea6', + color0: '#993366' + } + }, + + map: { + itemStyle: { + color: '#d9c3b0', + }, + areaStyle: { + color: '#ddd', + }, + label: { + color: '#c12e34' + } + }, + + graph: { + itemStyle: { + color: '#993366', + }, + linkStyle: { + color: '#3f7ea6' + } + }, + + gauge: { + axisLine: { + lineStyle: { + color: [[0.2, '#d9c3b0'],[0.8, '#3f7ea6'],[1, '#731f17']], + width: 8 + } + } + } + }; + + echarts.registerTheme('royal', theme); +})); \ No newline at end of file diff --git a/theme/sakura.js b/theme/sakura.js new file mode 100644 index 0000000000..697edb5958 --- /dev/null +++ b/theme/sakura.js @@ -0,0 +1,124 @@ +/* +* Licensed to the Apache Software Foundation (ASF) under one +* or more contributor license agreements. See the NOTICE file +* distributed with this work for additional information +* regarding copyright ownership. The ASF licenses this file +* to you under the Apache License, Version 2.0 (the +* "License"); you may not use this file except in compliance +* with the License. You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, +* software distributed under the License is distributed on an +* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY +* KIND, either express or implied. See the License for the +* specific language governing permissions and limitations +* under the License. +*/ + +(function (root, factory) {if (typeof define === 'function' && define.amd) { + // AMD. Register as an anonymous module. + define(['exports', 'echarts'], factory); + } else if (typeof exports === 'object' && typeof exports.nodeName !== 'string') { + // CommonJS + factory(exports, require('echarts')); + } else { + // Browser globals + factory({}, root.echarts); + } +}(this, function (exports, echarts) { + var log = function (msg) { + if (typeof console !== 'undefined') { + console && console.error && console.error(msg); + } + }; + if (!echarts) { + log('ECharts is not Loaded'); + return; + } + + var colorPalette = ['#e52c3c','#f7b1ab','#fa506c','#f59288','#f8c4d8', + '#e54f5c','#f06d5c','#e54f80','#f29c9f','#eeb5b7' + ]; + + var theme = { + + color: colorPalette, + + title: { + textStyle: { + fontWeight: 'normal', + color: '#e52c3c' + } + }, + + visualMap: { + color:['#e52c3c','#f7b1ab'] + }, + + dataRange: { + color:['#e52c3c','#f7b1ab'] + }, + + candlestick: { + itemStyle: { + color: '#e52c3c', + color0: '#f59288', + }, + lineStyle: { + width: 1, + color: '#e52c3c', + color0: '#f59288', + }, + areaStyle: { + color: '#fa506c', + color0: '#f8c4d8' + } + }, + + map: { + itemStyle: { + color: '#e52c3c', + borderColor: '#fff', + borderWidth: 1 + }, + areaStyle: { + color: '#ccc', + }, + label: { + color: 'rgba(139,69,19,1)', + show: false + } + }, + + graph: { + itemStyle: { + color: '#f2385a', + }, + nodeStyle : { + brushType : 'both', + strokeColor : '#e54f5c' + }, + linkStyle: { + color: '#f2385a', + strokeColor : '#e54f5c' + }, + label: { + color: '#f2385a', + show: false + } + }, + + gauge: { + axisLine: { + lineStyle: { + color: [[0.2, '#e52c3c'],[0.8, '#f7b1ab'],[1, '#fa506c']], + width: 8 + } + } + } + }; + + echarts.registerTheme('sakura', theme); +})); \ No newline at end of file diff --git a/theme/shine.js b/theme/shine.js index e28066cd4e..89261a0c87 100644 --- a/theme/shine.js +++ b/theme/shine.js @@ -1,22 +1,3 @@ -/* -* Licensed to the Apache Software Foundation (ASF) under one -* or more contributor license agreements. See the NOTICE file -* distributed with this work for additional information -* regarding copyright ownership. The ASF licenses this file -* to you under the Apache License, Version 2.0 (the -* "License"); you may not use this file except in compliance -* with the License. You may obtain a copy of the License at -* -* http://www.apache.org/licenses/LICENSE-2.0 -* -* Unless required by applicable law or agreed to in writing, -* software distributed under the License is distributed on an -* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY -* KIND, either express or implied. See the License for the -* specific language governing permissions and limitations -* under the License. -*/ - (function (root, factory) {if (typeof define === 'function' && define.amd) { // AMD. Register as an anonymous module. define(['exports', 'echarts'], factory); @@ -75,59 +56,54 @@ handleColor: '#005eaa' }, - timeline: { - lineStyle: { - color: '#005eaa' - }, - controlStyle: { - normal: { - color: '#005eaa', - borderColor: '#005eaa' - } - } + timeline: { + lineStyle: { + color: '#005eaa' }, + controlStyle: { + color: '#005eaa', + borderColor: '#005eaa' + } + }, - candlestick: { - itemStyle: { - normal: { - color: '#c12e34', - color0: '#2b821d', - lineStyle: { - width: 1, - color: '#c12e34', - color0: '#2b821d' - } - } - } - }, + candlestick: { + itemStyle: { + color: '#c12e34', + color0: '#2b821d', + }, + lineStyle: { + width: 1, + color: '#c12e34', + color0: '#2b821d', + }, + areaStyle: { + color: '#e6b600', + color0: '#005eaa' + } + }, - graph: { - color: colorPalette - }, + graph: { + itemStyle: { + color: '#e6b600', + }, + linkStyle: { + color: '#005eaa' + } + }, - map: { - label: { - normal: { - textStyle: { - color: '#c12e34' - } - }, - emphasis: { - textStyle: { - color: '#c12e34' - } - } - }, - itemStyle: { - normal: { - borderColor: '#eee', - areaColor: '#ddd' - }, - emphasis: { - areaColor: '#e6b600' - } - } - }, + map: { + itemStyle: { + color: '#f2385a', + borderColor: '#eee', + areaColor: '#ddd' + }, + areaStyle: { + color: '#ddd', + }, + label: { + color: '#c12e34' + } + }, gauge: { axisLine: { diff --git a/theme/tech-blue.js b/theme/tech-blue.js new file mode 100644 index 0000000000..0849264f6d --- /dev/null +++ b/theme/tech-blue.js @@ -0,0 +1,162 @@ +/* +* Licensed to the Apache Software Foundation (ASF) under one +* or more contributor license agreements. See the NOTICE file +* distributed with this work for additional information +* regarding copyright ownership. The ASF licenses this file +* to you under the Apache License, Version 2.0 (the +* "License"); you may not use this file except in compliance +* with the License. You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, +* software distributed under the License is distributed on an +* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY +* KIND, either express or implied. See the License for the +* specific language governing permissions and limitations +* under the License. +*/ + +(function (root, factory) {if (typeof define === 'function' && define.amd) { + // AMD. Register as an anonymous module. + define(['exports', 'echarts'], factory); + } else if (typeof exports === 'object' && typeof exports.nodeName !== 'string') { + // CommonJS + factory(exports, require('echarts')); + } else { + // Browser globals + factory({}, root.echarts); + } +}(this, function (exports, echarts) { + var log = function (msg) { + if (typeof console !== 'undefined') { + console && console.error && console.error(msg); + } + }; + if (!echarts) { + log('ECharts is not Loaded'); + return; + } + + var colorPalette = [ + '#4d4d4d','#3a5897','#007bb6','#7094db','#0080ff', + '#b3b3ff','#00bdec','#33ccff','#ccddff','#eeeeee' + ]; + + var theme = { + + color: colorPalette, + + title: { + textStyle: { + fontWeight: 'normal', + color: '#00aecd' + } + }, + + visualMap: { + color: ['#00aecd','#a2d4e6'] + }, + + toolbox: { + color: ['#00aecd','#00aecd','#00aecd','#00aecd'] + }, + + tooltip: { + backgroundColor: 'rgba(0,0,0,0.5)', + axisPointer: { // Axis indicator, coordinate trigger effective + type: 'line', // The default is a straight line： 'line' | 'shadow' + lineStyle: { // Straight line indicator style settings + color: '#00aecd', + type: 'dashed' + }, + crossStyle: { + color: '#00aecd' + }, + shadowStyle: { // Shadow indicator style settings + color: 'rgba(200,200,200,0.3)' + } + } + }, + + // Area scaling controller + dataZoom: { + dataBackgroundColor: '#eee', // Data background color + fillerColor: 'rgba(144,197,237,0.2)', // Fill the color + handleColor: '#00aecd' // Handle color + }, + + timeline: { + lineStyle: { + color: '#00aecd' + }, + controlStyle: { + normal: { color: '#00aecd'}, + emphasis: { color: '#00aecd'} + } + }, + + candlestick: { + itemStyle: { + color: '#ddd', + color0: '#eee', + }, + lineStyle: { + width: 1, + color: '#33ccff', + color0: '#1bb4cf', + }, + areaStyle: { + color: '#7094db', + color0: '#33ccff' + } + }, + + chord: { + padding: 4, + itemStyle: { + color: '#7094db', + borderWidth: 1, + borderColor: 'rgba(128, 128, 128, 0.5)', + }, + lineStyle: { + color: 'rgba(128, 128, 128, 0.5)', + }, + areaStyle: { + color: '#33ccff', + } + }, + + graph: { + itemStyle: { + color: '#7094db', + }, + linkStyle: { + color: '#33ccff' + } + }, + + map: { + itemStyle: { + color: '#7094db', + }, + areaStyle: { + color: '#33ccff', + }, + label: { + color: '#ddd' + } + }, + + gauge: { + axisLine: { + lineStyle: { + color: [[0.2, '#dddddd'],[0.8, '#00aecd'],[1, '#33ccff']], + width: 8 + } + } + } + }; + + echarts.registerTheme('tech-blue', theme); +})); \ No newline at end of file diff --git a/theme/theme-screenshots.png b/theme/theme-screenshots.png new file mode 100644 index 0000000000..6bcfbeadf9 Binary files /dev/null and b/theme/theme-screenshots.png differ