最近几年来,地理信息系统无论是在理论上还是应用上都处在一个飞速发展的阶段。 GIS被应用于多个领域的建模和决策支持,如城市管理、区划、环境整治等等,地理信息成为信息时代重要的组成部分之一; “数字地球”概念的提出,更进一步推动了作为其技术支撑的GIS的发展。 与此同时,一些学者致力于相关的理论研究,如空间感知、空间数据误差、空间关系的形式化等等。 这恰好说明了地理信息系统作为应用技术和学科的两个方面,并且这两个方面构成了相互促进的发展过程。
ECharts can change the color, shade, size, etc., of graphic elements or textthrough style settings. Starting with ECharts4, in addition to the default theme, two sets of themesare built-in, namely The mode of use is as follows: Or In addition, we can also use the official Theme Editor choose your favorite theme to download. JS and JSON versions are currently available for theme downloads. If you use the JS version, you can save the JS theme code to a theme name .js file, then reference the file in HTML, and finally use the theme in the code. For example, in the figure above, we selected a theme and saved the JS code as If the theme is saved as a JSON file, you can load and register it yourself. For example, in the figure above, we selected a theme and saved the JSON code as Note: we used the The color palette can be found in The color palette is given a set of colors, from which the graphics and series automatically select colors. You can set a global color palette, or you can set your own color palette. Examples of global palettes: Series of color palette examples: Direct styling is a more common way of setting. An overview of ECharts’s option in many places, you can set up itemStyle 、 `lineStyle In general, the various series and components of ECharts follow these naming conventions, although in different diagrams and components For another introduction to direct styling, see the ECharts pie chart. A highlighted style usually appears when the mouse hovers over a graphic element. By default, highlighted styles are automatically generated based onnormal styles. If you want to customize the highlight style, you can use the 9.5.1. Color theme ¶
light and dark .Example ¶
varchart=echarts.init(dom,'light');
varchart=echarts.init(dom,'dark');
wonderland.js .Example ¶
... // After introducing the wonderland.js file into HTML, call it during initialization var myChart = echarts.init(dom, 'wonderland'); // ...
wonderland.json .Example ¶
//The theme name is wonderland $.getJSON('wonderland.json', function (themeJSON) { echarts.registerTheme('wonderland', themeJSON) var myChart = echarts.init(dom, 'wonderland'); }); $.getJSON , so you need to introduce jQuery . 9.5.2. Color palette ¶
option set in the.option = { // Global color palette. color: ['#c23531','#2f4554', '#61a0a8', '#d48265', '#91c7ae','#749f83', '#ca8622', '#bda29a','#6e7074', '#546570', '#c4ccd3'], series: [{ type: 'bar', // This series has its own color palette. color: ['#dd6b66','#759aa0','#e69d87','#8dc1a9','#ea7e53','#eedd78','#73a373','#73b9bc','#7289ab', '#91ca8c','#f49f42'], ... }, { type: 'pie', // This series has its own color palette. color: ['#37A2DA', '#32C5E9', '#67E0E3', '#9FE6B8', '#FFDB5C','#ff9f7f', '#fb7293', '#E062AE', '#E690D1', '#e7bcf3', '#9d96f5', '#8378EA', '#96BFFF'], ... }] }
Example ¶
// Global color palette. color: ['#ff0000','#00ff00', '#0000ff', '#d48265', '#91c7ae','#749f83', '#ca8622', '#bda29a','#6e7074', '#546570', '#c4ccd3'],
Example ¶
series: [{ type: 'pie', // This series has its own color palette. color: ['#ff0000','#00ff00', '#0000ff', '#9FE6B8', '#FFDB5C','#ff9f7f', '#fb7293', '#E062AE', '#E690D1', '#e7bcf3', '#9d96f5', '#8378EA', '#96BFFF'], ... }]
9.5.3. Direct styling itemStyle, lineStyle, areaStyle, label,… ¶
itemStyle ,``label`` and so on may show up in different places. 9.5.4. Highlighted style:
emphasis ¶ emphasis property to customize:Example ¶
// Highlight the style. emphasis: { itemStyle: { // The color of the highlighted point color: 'red' }, label: { show: true, // Text of the label when highlighted formatter: 'Label content displayed when highlighted' } },