Closed 1974892005 closed 1 year ago
图表无法正常展示 刚开始以为是webwiew没加载 改了一下是echart 没有生成;
react-native-echarts-pro【1.8.9】 react-native version【0.70.5】 react-native-webview 【11.23.1】 Platform【android | Ios】 System【12 | 16】 Demo: import React from "react"; import { View } from "react-native"; import RNEChartsPro from "react-native-echarts-pro"; export default function ChartsComponent() { const [Caiwu, setCaiwu] = useState([111, 222, 333, 444]) const Caiwu_e = { height: 150, title: { show: false }, textStyle: echartInit.textStyle, color: echartInit.color, legend: echartInit.legend, toolbox: echartInit.toolbox, tooltip: { ...echartInit.tooltip, // trigger: 'item', }, xAxis: { type: 'category', data: ['Mon', 'Tue', 'Wed', 'Thu'] , ...echartInit.xAxis }, yAxis: { type: 'value', ...echartInit.yAxis }, // grid: echartInit.grid, series: [ { ...echartInit.series, data: Caiwu, name: '测试2', type: 'bar', itemStyle: { color: AppColor.echarts.blue } } ], };
};
return ( <View style={{ height: 300, paddingTop: 25 }}> <RNEChartsPro height={240} option={Caiwu_e} webViewSettings={{ style: { backgroundColor: AppColor.TP, } }} /> ); }
代码里的 echartInit 和 AppColor.echarts 对象从哪里引用的呢?
echartInit
AppColor.echarts
可以先看下教程,运行下示例demo,和 PC 版本的示例可能有些许出入。
demo
PC
图表无法正常展示 刚开始以为是webwiew没加载 改了一下是echart 没有生成;
react-native-echarts-pro【1.8.9】 react-native version【0.70.5】 react-native-webview 【11.23.1】 Platform【android | Ios】 System【12 | 16】 Demo: import React from "react"; import { View } from "react-native"; import RNEChartsPro from "react-native-echarts-pro"; export default function ChartsComponent() { const [Caiwu, setCaiwu] = useState([111, 222, 333, 444]) const Caiwu_e = { height: 150, title: { show: false }, textStyle: echartInit.textStyle, color: echartInit.color, legend: echartInit.legend, toolbox: echartInit.toolbox, tooltip: { ...echartInit.tooltip, // trigger: 'item', }, xAxis: { type: 'category', data: ['Mon', 'Tue', 'Wed', 'Thu'] , ...echartInit.xAxis }, yAxis: { type: 'value', ...echartInit.yAxis }, // grid: echartInit.grid, series: [ { ...echartInit.series, data: Caiwu, name: '测试2', type: 'bar', itemStyle: { color: AppColor.echarts.blue } } ], };
};
return ( <View style={{ height: 300, paddingTop: 25 }}> <RNEChartsPro height={240} option={Caiwu_e} webViewSettings={{ style: { backgroundColor: AppColor.TP, } }} /> ); }