Echarts中symbol加载base64图片不显示解决

最新推荐文章于 2024-04-29 22:09:50 发布

布尔没有码

最新推荐文章于 2024-04-29 22:09:50 发布

阅读量869

点赞数

文章标签： echarts 前端服务器

本文链接：https://blog.csdn.net/qq_24130591/article/details/133091317

版权

markPoint: {
          data: [
            {
              type: "max",
              name: "Max",
              symbol:
                "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAC8AAAAtCAYAAAA+7zKnAAAAAXNSR0IArs4c6QAAAARzQklUCAgICHwIZIgAAALeSURBVGiB7ZffShtBFId/Z0myJAhBsNCiRcS0RINgFEH8uxUVDXghFER8g3jjG7h5Bh/AW3snVEpB0PFGJSBCEZOg0BZjtSklVlPdNZrTC5MiRmtiNtkU8sGwM7Ozh+/s7MzuYnp6emhubi4aDoe/jY+PD+E/QpIkycfMtZIkvSAin9lCefGuo2PjpLeXz2dm+H17+wYA7LndislaOUHBmhp+3dQEp9OJn6EQji4vhd3hUOwOB+x2O+wOB2RZFvrFhbCvrATMFr6NlNVDpNwzTmEiNd7dzUdtbbNFt8qRbPnHIFK/eDwccblMTyJ/+TTMrH6qq1s1UiZfniwPAAwou42NvNfcbMosFCSfgQH1c2tryRMwRB4AmEg96Ozko76+2R/DwyVJxGJ4RCKVAJyMjakWWRZWm01YZVmhVArQdUDTFOg60kVcJZPCGgw+aQs2Xv4WBCggUvimng2zwoBy7vWqyWRSde7s5JWEYY9NoRCR+ivPdVM28sDNwv89MJBzAmUlD9wsfG1iIqf3R9nJAwAxK9d+P1/7/f+chbKUz8BEqjY1xWc+32y8p0e5e76ou41hEKnMjO8eD67icfXy9HStIZEQ5SIvbjeYCMwMEIEzfcwiRbSWkiQ0JBICMPPOMwtIUsAWDIqnhjBDXoA5QKurotBApZZXaXHRsL+xksgTIEAUoIUFYWTcbPlU6g0ToXZ7WwDAxeCgwsz9ANR8gzMgUkQBaX5eFOh5L/Th+fODM6+3ruHwECfHx9HhWOzlQ4PjXV2zmqZB13U1fYRVlmFJl791m01YZDlQvbRUFOkMlt2Wlk3b6Ohb78gIFicnNxGLPTi4en0987wGQi6XAqCfmUEAiBkA1kCEZ8vLRZXOYPnqdkdfpRvh+vootrZyurBpf1/gzv5casr68+AxKvJmUZE3i4q8WVTkzaIibxYVebOoyJtFRd4sLKFQ6GNVVZUWiUQQjUaF2UL58AdsmgbffJ6AGgAAAABJRU5ErkJggg==",
              label: {
                show: false,
              },
              symbolOffset: ["50%", "-50%"],
            },
          ],
        },

直接把symbol中的数据写入base64数据,图片加载不出来,在base64数据前加入 image:// 即可.

也就是以下代码

markPoint: {
          data: [
            {
              type: "max",
              name: "Max",
              symbol:
                "image://data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAC8AAAAtCAYAAAA+7zKnAAAAAXNSR0IArs4c6QAAAARzQklUCAgICHwIZIgAAALeSURBVGiB7ZffShtBFId/Z0myJAhBsNCiRcS0RINgFEH8uxUVDXghFER8g3jjG7h5Bh/AW3snVEpB0PFGJSBCEZOg0BZjtSklVlPdNZrTC5MiRmtiNtkU8sGwM7Ozh+/s7MzuYnp6emhubi4aDoe/jY+PD+E/QpIkycfMtZIkvSAin9lCefGuo2PjpLeXz2dm+H17+wYA7LndislaOUHBmhp+3dQEp9OJn6EQji4vhd3hUOwOB+x2O+wOB2RZFvrFhbCvrATMFr6NlNVDpNwzTmEiNd7dzUdtbbNFt8qRbPnHIFK/eDwccblMTyJ/+TTMrH6qq1s1UiZfniwPAAwou42NvNfcbMosFCSfgQH1c2tryRMwRB4AmEg96Ozko76+2R/DwyVJxGJ4RCKVAJyMjakWWRZWm01YZVmhVArQdUDTFOg60kVcJZPCGgw+aQs2Xv4WBCggUvimng2zwoBy7vWqyWRSde7s5JWEYY9NoRCR+ivPdVM28sDNwv89MJBzAmUlD9wsfG1iIqf3R9nJAwAxK9d+P1/7/f+chbKUz8BEqjY1xWc+32y8p0e5e76ou41hEKnMjO8eD67icfXy9HStIZEQ5SIvbjeYCMwMEIEzfcwiRbSWkiQ0JBICMPPOMwtIUsAWDIqnhjBDXoA5QKurotBApZZXaXHRsL+xksgTIEAUoIUFYWTcbPlU6g0ToXZ7WwDAxeCgwsz9ANR8gzMgUkQBaX5eFOh5L/Th+fODM6+3ruHwECfHx9HhWOzlQ4PjXV2zmqZB13U1fYRVlmFJl791m01YZDlQvbRUFOkMlt2Wlk3b6Ohb78gIFicnNxGLPTi4en0987wGQi6XAqCfmUEAiBkA1kCEZ8vLRZXOYPnqdkdfpRvh+vootrZyurBpf1/gzv5casr68+AxKvJmUZE3i4q8WVTkzaIibxYVebOoyJtFRd4sLKFQ6GNVVZUWiUQQjUaF2UL58AdsmgbffJ6AGgAAAABJRU5ErkJggg==",
              label: {
                show: false,
              },
              symbolOffset: ["50%", "-50%"],
            },
          ],
        },