search

highcharts / highcharts-vue

Other
686 stars 150 forks source link

how to change the theme? #70

Closed linusic closed 5 years ago

linusic commented 5 years ago

hi, i want to want to use the dark-unica.js theme. how can i add the theme into your highcharts-vue?

Denyllon commented 5 years ago

Hello @hacker-lin ,

Thank you for contacting us. If you would like to set the theme to Dark Unica, you need to import it like any other module, and call it with Highcharts passed as an argument. I prepared the example in order to show how to set it, so please take a look on it.

import HighchartsVue from "highcharts-vue";
import Highcharts from "highcharts";
import darkUnica from "highcharts/themes/dark-unica";

darkUnica(Highcharts);
Vue.use(HighchartsVue);

Live example: https://codesandbox.io/s/k2wwxqj2qo

Kind regards!

linusic commented 5 years ago

Thanks to your answer! emm, first, your suggest does not work for me， and I continue to search the answer. Finally, I find it, because my highchart' version is too high, it was 7.1.1 I try 5.+ 7.+ version, they all do not work. But the 6.1.1 is good， then try your code, it is wonderful !

I suggest that you can declare the version of all requirements , and it will be better! Thanks!

Denyllon commented 5 years ago

It shouldn't be any problem that your Highcharts version is the newest one (or v5.x.x), and themes should apply without any issues. I've updated the packages on the example sent previously, and noticed that theme is applied but the chart not displaying the data at all. The reason was the fact, that the series was an object instead of array of objects, so I fixed it, and now it's working with upgraded dependencies.

Kind regards!