Maison > interface Web > js tutoriel > le corps du texte

Comment wx.getImageInfo() obtient les informations sur l'image

小云云
Libérer: 2018-05-23 11:23:52
original
3784 Les gens l'ont consulté

Cet article présente principalement en détail comment l'applet WeChat wx.getImageInfo() obtient des informations sur l'image. Elle a une certaine valeur de référence. Les amis intéressés peuvent s'y référer.

1. Points de connaissances

2. 1). Lors du chargement de



<view class="zn-uploadimg">  
  <image src="{{tempFilePaths}}" mode="aspecFill" style="width: 100%; height: 450rpx" />  
  <text>图片的大小:{{imgwidth}}px*{{imgheight}}px</text> 
</view>
Copier après la connexion
var app = getApp()  
Page({ 
  data: {  
    tempFilePaths: &#39;../uploads/foods.jpg&#39;, 
    imgwidth:0, 
    imgheight:0,  
  }, 
  onReady:function(){ 
    // 页面渲染完成  
    var _this = this;  
    wx.getImageInfo({ 
      src: _this.data.tempFilePaths, 
      success: function (res) { 
        _this.setData({ 
          imgwidth:res.width, 
          imgheight:res.height, 
        }) 
      } 
    })  
  }  
})
Copier après la connexion
(2). >



<view class="zn-uploadimg"> 
  <button type="primary"bindtap="chooseimage">获取图片</button>  
  <image src="{{tempFilePaths}}" mode="aspecFill" style="width: 100%; height: 450rpx"/>  
  <text>图片的大小:{{imgwidth}}px*{{imgheight}}px</text> 
</view>
Copier après la connexion
Recommandations associées :
.zn-uploadimg{ 
  padding:1rem; 
} 
.zn-uploadimg image{ 
  margin:1rem 0; 
}
Copier après la connexion
var app = getApp()  
Page({ 
  data: {  
    tempFilePaths: &#39;&#39;,  
    imgwidth:0, 
    imgheight:0, 
  }, 
  /**  
   * 上传图片 
   */ 
  chooseimage: function () {  
    var _this = this;  
    wx.chooseImage({  
      count: 1, // 默认9  
      sizeType: [&#39;original&#39;, &#39;compressed&#39;], // 可以指定是原图还是压缩图,默认二者都有  
      sourceType: [&#39;album&#39;, &#39;camera&#39;], // 可以指定来源是相册还是相机,默认二者都有  
      success: function (res) {  
        // 返回选定照片的本地文件路径列表,tempFilePath可以作为img标签的src属性显示图片  
        _this.setData({  
          tempFilePaths:res.tempFilePaths  
        })  
        wx.getImageInfo({ 
          src: res.tempFilePaths[0], 
          success: function (res) { 
            _this.setData({ 
              imgwidth:res.width, 
              imgheight:res.height, 
            }) 
          } 
        })  
      }  
    })  
  }  
})
Copier après la connexion

Comment obtenir des photos avec javascript Les N principales valeurs de couleur principale​​


Introduction à la méthode d'obtention de la couleur principale de l'image en PHP

Partagez une méthode JS pour obtenir la taille et l'aperçu de l'image

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal
À propos de nous Clause de non-responsabilité Sitemap
Site Web PHP chinois:Formation PHP en ligne sur le bien-être public,Aidez les apprenants PHP à grandir rapidement!