Components
VChartIsland
Nuxt ECharts provides the <VChartIsland> component to render a non-interactive ECharts SVG without any client JS.
<VChartIsland> uses <NuxtIsland> under the hood. When rendering an island component, the content of the island component is static, thus no JS is downloaded client-side. Since there is no JS, Provide / Inject does not work for <VChartIsland>, you need to use <VChartServer> which wraps <VChartIsland>.
Changing the island component props triggers a refetch of the island component to re-render ECharts again.
<VChartIsland> is used by VChart, VChartServer and VChartLight for Server-side Rendering.Props
init-options
object
Optional chart init configurations. See
echarts.init's opts parameter. Injection key: INIT_OPTIONS_KEY.We have to specify the
height and width property in init-options for SSR.theme
string | object
option
object
ECharts' universal interface. Modifying this prop will trigger ECharts'
setOption method. Read more here →.Ref
refresh()
() => Promise<void>
Force refetch the server component by refetching it.
Events
error
(error: unknown) => void
Emitted when when
NuxtIsland fails to fetch the new island.