Coder Social home page Coder Social logo

Comments (3)

yah0130 avatar yah0130 commented on August 27, 2024

我按照常见问题中的第三点的解决方法,去展示两个图表,但是运行起来的时候只显示了第一个图表,

html部分

js部分:
let RadialChart = ''
let RadialOption = {}

let HorizontalChart = ''
let HorizontalOption = {}

js部分____data中的数据:
RadialEc: { //温度的图表配置项
lazyLoad: true,
},
HorizontalEc: { //水平的图表配置项
lazyLoad: true,
}
onload:
onLoad(option) {
setTimeout(() => {
// this.ec.option.series[0].data = [1, 2, 3, 4, 5, 6, 7];
this.initRadial()
console.log("Radial图表加载啦");
}, 1000);
setTimeout(() => {
this.initHorizontal()
console.log("Horizontal图表加载啦")
}, 1500)
},

methods部分:

//初始化Radial图表
initRadialChart(canvas, width, height, canvasDpr) {
// console.log(canvas, width, height, canvasDpr)
RadialChart = echarts.init(canvas, null, {
width: width,
height: height,
devicePixelRatio: canvasDpr
})
canvas.setChart(RadialChart)
RadialChart.setOption(RadialOption)
return RadialChart
},
//初始化Horizontal图表
initHorizontalChart(canvas, width, height, canvasDpr) {
// console.log(canvas, width, height, canvasDpr)
HorizontalChart = echarts.init(canvas, null, {
width: width,
height: height,
devicePixelRatio: canvasDpr
})
canvas.setChart(HorizontalChart)
HorizontalChart.setOption(HorizontalOption)
return HorizontalChart
},

//加载radial数据
initRadial: function() {
RadialOption ={ 我的一些相关图表配置 };
this.$refs.canvas.init(this.initRadialChart)
},

//加载Horizontal数据
initHorizontal: function() {
HorizontalOption = { 我的一些相关图表配置 };
this.$refs.canvas.init(this.initHorizontal)
},

可以多个的,我自己项目里一个页面,4,5个图,是不是被挡住了

from echarts-wx-uniapp.

thl1723298894 avatar thl1723298894 commented on August 27, 2024

我按照常见问题中的第三点的解决方法,去展示两个图表,但是运行起来的时候只显示了第一个图表,
html部分
js部分:
let RadialChart =''
let RadialOption = {}
let Horizo​​ntalChart =''
let Horizo​​ntalOption = {}
js部分____data中的数据:
RadialEc:{//温度的
图表配置项lazyLoad:true,
},
Horizo​​ntalEc:{//水平的
图表配置项lazyLoad:true,
}
onload:
onLoad(option){
setTimeout(() => {
// this.ec.option.series [0] .data = [1、2、3、4、5、6、7];
this.initRadial()
console.log(“ Radial图表加载啦”) ;
},1000);
setTimeout(()=> {
this.initHorizo​​ntal()
console.log(“ Horizo​​ntal Chart加载啦”)
},1500)
},
方法部分:
//初始化Radial图表
initRadialChart(canvas, width, height, canvasDpr) {
// console.log(canvas, width, height, canvasDpr)
RadialChart = echarts.init(canvas, null, {
width: width,
height: height,
devicePixelRatio: canvasDpr
})
canvas.setChart(RadialChart)
RadialChart.setOption(RadialOption)
return RadialChart
},
//初始化Horizontal图表
initHorizontalChart(canvas, width, height, canvasDpr) {
// console.log(canvas, width, height, canvasDpr)
HorizontalChart = echarts.init(canvas, null, {
width: width,
height: height,
devicePixelRatio: canvasDpr
})
canvas.setChart(HorizontalChart)
HorizontalChart.setOption(HorizontalOption)
return HorizontalChart
},

//加载radial数据
initRadial: function() {
RadialOption ={ 我的一些相关图表配置 };
this.$refs.canvas.init(this.initRadialChart)
},

//加载Horizontal数据
initHorizontal: function() {
HorizontalOption = { 我的一些相关图表配置 };
this.$refs.canvas.init(this.initHorizontal)
},

可以多个的,我自己项目里一个页面,4,5个图,是不是被挡住了

您能发个例子么?如果挡住了有解决方案么?
我的微信小程序开发工具控制台不知道为什么打印了这么多个提示

image

from echarts-wx-uniapp.

yah0130 avatar yah0130 commented on August 27, 2024

你怎么会有这么多日志打印

from echarts-wx-uniapp.

Related Issues (15)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.