Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add files via upload - New theme JS files #11566

Merged
merged 3 commits into from Nov 19, 2019
Merged

Conversation

WebCodePro719
Copy link
Contributor

@WebCodePro719 WebCodePro719 commented Nov 5, 2019

I've created a fork of the ECharts master, and uploaded new theme JS files to the fork. I've also included the theme screenshots for users who may not go to the ECharts website to look at the themes.

I've created this pull request per this post: #11550

I hope I've completed the pull request correctly. If I need to do something else to contribute the custom theme files to ECharts please let me know. Thanks!

@pissang
Copy link
Contributor

pissang commented Nov 6, 2019

Thanks a lot for the contribution!

@WebCodePro719
Copy link
Contributor Author

WebCodePro719 commented Nov 6, 2019

You're welcome, and thanks for adding the themes!

theme/azul.js Outdated
}
},

k: {
Copy link
Contributor

@pissang pissang Nov 8, 2019

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

k has been renamed to candlestick since 3.0.0

Copy link
Contributor Author

@WebCodePro719 WebCodePro719 Nov 8, 2019

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ok, see post on main thread. Thanks!

color0: '#f5a503' // Yinbian border color
}
}
}
Copy link
Contributor

@pissang pissang Nov 8, 2019

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The hierarchy of itemStyle since 4.0.0 has been changed to

itemStyle: {
   color: ...
},
lineStyle: {
   color: ...
},
areaStyle: {
   color: ...
}

Copy link
Contributor Author

@WebCodePro719 WebCodePro719 Nov 8, 2019

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm a little confused about this. Please see post on main thread. Thanks!

theme/azul.js Outdated
}
},

force : {
Copy link
Contributor

@pissang pissang Nov 8, 2019

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

force has been ranamed to graph since 3.0.0

Copy link
Contributor Author

@WebCodePro719 WebCodePro719 Nov 8, 2019

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ok, see post on main thread. Thanks!

@WebCodePro719
Copy link
Contributor Author

WebCodePro719 commented Nov 8, 2019

@pissang I noticed that you requested changes to the Azul theme (renamed a few elements, etc.)

Most of the theme files need these changes, so I'm updating them now (local files). I'll update the files on GitHub when I'm done fixing them locally.

If you see any other lines of code in the themes that need to be changed, please let me know.

Thanks!

@WebCodePro719
Copy link
Contributor Author

WebCodePro719 commented Nov 8, 2019

@pissang I've updated all the theme JS files so that "k" is renamed as "candlestick" and "force" is renamed as "graph."

For the hierarchy of itemStyle, are you saying that "normal: {....}" should be removed?

For example, in azul,js, would this code be correct?:

candlestick: {
	itemStyle: {
                 color: '#f2385a',
                 color0: '#f5a503',
	},
	lineStyle: {
                 width: 1,
                 color: '#f2385a',
                 color0: '#f5a503',
	},
	areaStyle: {
                 color: '#eee',
                 color0: '#ddd'
	}
},

graph: { 
	itemStyle: {
                 color: '#f2385a',
	},
        linkStyle: {
                 color: '#f2385a'
        }
},


map: { 
	itemStyle: {
                 color: '#f2385a',
	},
	areaStyle: {
                 color: '#eee',
                 label: {
                    textStyle: {
                        color: '#c12e34'
                    }
              }
	}
},

Please let me know if I've updated the code correctly in the above example. If so, I'll go through and update all the theme JS files to reflect these code changes.

If you see anything else that needs to be fixed (based on azul.js). please let me know. Thanks!

@pissang
Copy link
Contributor

pissang commented Nov 11, 2019

Hi @WebCodePro719

candlestick: {
	itemStyle: {
                 color: '#f2385a',
                 color0: '#f5a503',
	},
	lineStyle: {
                 width: 1,
                 color: '#f2385a',
                 color0: '#f5a503',
	},
	areaStyle: {
                 color: '#eee',
                 color0: '#ddd'
	}
},

graph: { 
	itemStyle: {
                 color: '#f2385a',
	},
        linkStyle: {
                 color: '#f2385a'
        }
}

These are correct. normal is removed

map: { 
	itemStyle: {
                 color: '#f2385a',
	},
	areaStyle: {
                 color: '#eee',
                 label: {
                    textStyle: {
                        color: '#c12e34'
                    }
              }
	}
},

About this part. Label should be in the same level with areaStyle and itemStyle. Also textStyle is removed. So it sould be:

map: { 
	itemStyle: {
                 color: '#f2385a',
	},
	areaStyle: {
                 color: '#eee'
	},
        label: {
              color: '#c12e34'
        }
},

All these changes since 4.0 are trying to make option more flatten and cleaner.

@WebCodePro719
Copy link
Contributor Author

WebCodePro719 commented Nov 11, 2019

Hi @pissang - Thank you for your help, I really appreciate it! I'll go through and fix all the theme files. I'll upload the fixed files to GitHub as soon as I can. It will probably take me a few days.

Updated custom and default theme JS files, and PNG.
@WebCodePro719
Copy link
Contributor Author

WebCodePro719 commented Nov 15, 2019

Hi @pissang - I've updated the code in all the theme JS files, including five of the default themes.

Some of the themes were created by other users and contributed to ECharts back when ECharts was version 2.0. For these themes, I changed as much of the code as I could. I'm not sure how to update some of the code in the older 2.0 themes.

I've uploaded all the updated files to the forked repository. If I need to do anything else, please let me know.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

2 participants