How does WeChat Mini Programs display SVG?

1. Question:

The data returned by the

background is a link to the svg image, such as:" http://abc.com/a.svg". Now to render in Mini Program page, Mini Program has no SVG component.

2. Try to put the link directly in the src of the image component without displaying it.

3. Or how to convert the SVG code in Mini Program into the base64? available for the picture.
PC can use src= "data:image/svg+xml;base64," + the svg code that window.btoa (unescape (encodeURIComponent (wants to convert), but how to transfer it in Mini Program?

ask the god!

Html5 javascript Mini-Program

Oct.12,2021

got it. It got complicated at first. It turns out that Mini Program api can be converted into base64. The code is as follows

   just play svg with image src


										
												Previous: Js time format Thu Nov 08 2018 00:00:00 GMT+0800 (China Standard time)
												                		Next: How Laravel operates multiple databases
                							
					
						
					
															
						
														
								How to make Mini Program "read aloud"?
								 wanted to be a Mini Program who memorized words, but found that no corresponding api interface was provided. After searching the Internet, I found that SpeechSynthesisUtterance allows JavaScript to read aloud without networking. But when the real phone i...
								
									
																														Html5
																				javascript
																				Mini-Program
																			
									
										Mar.07,2021
									
								
							
														
								WeChat Mini Programs's wx.sendSocketMessage interface can not send ArrayBuffer or is it wrong?
								
 currently, a project is under development. The following code is used to send data on Wechat developer  s tool. The server can receive the data and parse it successfully, but the debug QR code of scanning developer  s tool cannot send data on the real p...
								
									
																														Html5
																				javascript
																				Mini-Program
																			
									
										Mar.07,2021
									
								
							
														
								The method in the wepy framework computed, how to pass parameters in the template
								
 there is such a demand at present: 
<view wx:for=  {{getUserInfo}}   wx:key=  index   wx:for-index=  index  >
    <!-- -->
    <view>{{item.name}}< view>
    <!-- -->
    <view>{{setUserName}}< view> 
< view&...
								
									
																														Php
																				html5
																				javascript
																				Mini-Program
																				wepy
																			
									
										Mar.13,2021
									
								
							
														
								Does the eslint file exist or report an error?
								
  
 as shown in the figure, my project already has an eslint file, but I still can  t find it when I report an error. Why? Mainly because it was all good before 
...
								
									
																														Node.js
																				html5
																				javascript
																				Mini-Program
																				wepy
																			
									
										Mar.14,2021
									
								
							
														
								WeChat Mini Programs's problem of using wx openLocation to adjust the map
								 I use wx.openLocation to adjust the map directly. The green button in the lower right corner of the iPhone allows me to choose the route, but there is no route option on Android. Why? ...
								
									
																														Html5
																				javascript
																				Mini-Program
																				WeChat-Mini-Programs
																			
									
										Mar.14,2021
									
								
							
														
								Is it true that directly calling wx.openLocation, will not pop up the authorization box? I tried three mobile phones but did not play. Why does the official document say that authorization is needed?
								 is it true that calling wx.openLocation, directly won  t pop up the authorization box? I tried three phones but didn  t play. Why does the official document say that authorization is needed? ...
								
									
																														Html5
																				javascript
																				Mini-Program
																				WeChat-Mini-Programs
																			
									
										Mar.14,2021
									
								
							
														
								Mini Program wx.getUserInfo this interface is only the future do not play the authorization box or the interface is completely abandoned ah?
								 I read the official document that this API has been adjusted, and there will be no authorization pop-up window using this API. Please use < button open-type=  "getUserInfo " > <   button > to guide the user to take the initiative to authorize the operati...
								
									
																														Html5
																				javascript
																				Mini-Program
																				WeChat-Mini-Programs
																			
									
										Mar.15,2021
									
								
							
														
								I would like to ask Mini Program what information obtained by wx.getUserInfo needs to be transmitted to his own server?
								 what my Mini Program needs is to help the backend get the unionid to get through the official account and Mini Program. I get the login status and maintain the login. ...
								
									
																														Html5
																				javascript
																				Mini-Program
																				WeChat-Mini-Programs
																			
									
										Mar.15,2021
									
								
							
														
								WeChat Mini Programs introduces other methods of js. What is the difference between using require and import?
								 for example, when my md5 encryption js is placed in the utils folder, and the js of the page needs to be introduced into md5, what is the difference between using require introduction and import introduction? I think the official document says to use req...
								
									
																														Html5
																				javascript
																				Mini-Program
																				WeChat-Mini-Programs
																			
									
										Mar.28,2021
									
								
							
														
								Mini Program debug request:fail url not in domain list with real machine
								
  
 whether to check the unchecked domain name or to report this error, developer tool version 1.02.1809260 
...
								
									
																														Html5
																				javascript
																				Mini-Program
																			
									
										Aug.12,2021
									
								
							
														
								WeChat Mini Programs form form submission checkBox cannot get a value
								
 beginner Mini Program, the checbox value of Baidu has not been reliable all afternoon. Come to the forum and ask the great gods 
 WeChat Mini Programs form form submission checkBox cannot get a value 
       <label class="checkbox">
    ...
								
									
																														Html5
																				javascript
																				Mini-Program
																			
									
										Jun.24,2022


				
					
						
	
						
		css
		mysql
		arrays
		josn
		react
		html
		typescript
		webpack
		npm
		sass
		R
		objective-c
		.net
		sql-server
		jquery
		python-3.x
		angularjs
		django
		angular
		excel
		regex
		iphone
		ajax
		linux
		xml
		pandas
		vba
		spring
		database
		wordpress
		string
		wpf
		xcode
		windows
		bash
		postgresql
		oracle
		multithreading
		eclipse
		list
		firebase
		algorithm
		macos
		forms
		image
		scala
		visual-studio
		azure
		bootstrap
		spring-boot
		react-native
		python-2.7
		docker
		performance
		function
		winforms
		matlab
		powershell
		apache
		dataframe
		api
		sqlite
		numpy
		rest
		shell
		selenium
		flutter
		dart
		maven
		loops
		qt
		swing
		android-studio
		csv
		express
		file
		class
		tensorflow
		sorting
		codeigniter
		perl
	
						MySQL Query :  SELECT * FROM `codeshelper`.`v9_news` WHERE status=99 AND catid='6' ORDER BY rand() LIMIT 5 
 MySQL Error : Disk full (/tmp/#sql-temptable-64f5-1bf70b9-32047.MAI); waiting for someone to free some space... (errno: 28 "No space left on device") 
 MySQL Errno : 1021 
 Message :  Disk full (/tmp/#sql-temptable-64f5-1bf70b9-32047.MAI); waiting for someone to free some space... (errno: 28 "No space left on device") 
Need Help?