web123456

Add polka dot ripples effect to Echarts graph (graph)

  • option = {
  • xAxis : [
  • {
  • type : 'value',
  • splitLine: {
  • show: false
  • },
  • axisTick: {
  • show: false
  • },
  • axisLabel: {
  • show: false,
  • interval: 0,
  • textStyle: {
  • color: 'white',
  • fontSize: 14,
  • },
  • rotate: 45
  • },
  • axisLine: {
  • show: false // Display and close the coordinate axes
  • }
  • }
  • ],
  • yAxis : [
  • {
  • type : 'value',
  • splitLine: {
  • show: false
  • },
  • axisTick: {
  • show: false
  • },
  • axisLabel: {
  • show: false,
  • textStyle: {
  • color: 'white',
  • fontSize: 14
  • }
  • },
  • axisLine: {
  • show: false // Display and close the coordinate axes
  • },
  • }
  • ],
  • series : [
  • {
  • type: 'effectScatter',
  • data: [
  • {
  • value:[50 , 9],
  • itemStyle: {
  • color: 'red'
  • },
  • symbol: 'rect'
  • },
  • {
  • value:[60 , 9],
  • itemStyle: {
  • color: 'red'
  • }
  • }
  • ],
  • symbolSize: 20,
  • rippleEffect: {
  • brushType: 'stroke'//Fill fill effect
  • },
  • },
  • {
  • type: 'graph',
  • layout: 'none',
  • coordinateSystem: 'cartesian2d',
  • symbolSize: 20,
  • zlevel: 5,
  • emphasis :{
  • disabled: false,
  • label:{
  • show:false
  • }
  • },
  • label: {
  • show: true,
  • position: "bottom",
  • distance: 10,
  • },
  • edgeLabel:{
  • show: false,
  • color: "#fff",
  • tooltip:{
  • show:false
  • }
  • },
  • edgeSymbol: ['', 'arrow'],
  • edgeSymbolSize: [0, 10],
  • data: [{
  • name: 'Node 1',
  • value: [50,9],
  • itemStyle: {
  • color: 'red'
  • },
  • symbol: 'rect'
  • }, {
  • name: 'Node 2',
  • value: [60, 9],
  • itemStyle: {
  • color: 'red'
  • },
  • }]
  • }
  • ]
  • };