Safari iOS 8上的Webgl图像纹理失败

时间:2015-02-22 13:15:42

标签: javascript ios8 three.js webgl

以下示例在所有主流浏览器上都能正常运行,即使在Safari Mac OS上也是如此,但它无法在我的iPad上使用最近的iOS8显示正确的图像。 http://mrdoob.github.io/three.js/examples/webgl_panorama_equirectangular.html

此外,以下教程在iOS8上也无法正常工作。

http://blog.thematicmapping.org/2014/01/photo-spheres-with-threejs.html

我们应该如何在webgl iOS中显示全景图像?

3 个答案:

答案 0 :(得分:1)

移动设备不允许纹理大小与桌面浏览器相同。 webgl_panorama_equirectangular.html示例中的纹理是4096x2048,这对于移动设备来说很重要。减小纹理的大小,但保持2的力量。

答案 1 :(得分:0)

在iOS上访问http://webglreport.com/,我们会看到“最大纹理大小:4096”。事实上iOS支持全景图像高达4096 * 2048,但是,我相信在three.js中有一个bug。在我的测试中,如果全景图像的大小大于4096,它将自动缩放到4096 * 2048并且它将被正确渲染。但是,如果图像大小正好是4096 * 2048,则不会进行缩放,渲染有问题。

作为一种解决方法,你可以对函数clampToMaxSize做三个小的改动:

更改

Option

let paths = fs::read_dir(&Path::new(
  &env::current_dir().unwrap())).unwrap();

let names =
paths.map(|entry| {
  let entry = entry.unwrap();

  let entry_path = entry.path();

  let file_name = entry_path.file_name().unwrap();

  let file_name_as_str = file_name.to_str().unwrap();

  let file_name_as_string = String::from(file_name_as_str);

  file_name_as_string
}).collect::<Vec<String>>();

这意味着我们缩放尺寸为4096 * 2048的图像。在函数clampToMaxSize中,它最重要的是

import java.util.ArrayList;
import java.util.Collections; 
import java.util.HashMap; import java.util.Iterator; import java.util.List;
import java.util.Map;

public class PrintLLargestSubString {

    public static void main(String[] args){         String string =
            "abcdefghijklmnopqrstuvbcdefghijklmnopbcsdcelfabcdefghi";
    List<Integer> list = new ArrayList<Integer> ();         List<Integer>
    keyList = new ArrayList<Integer> ();        List<Integer> Indexlist = new
    ArrayList<Integer> ();      List<Integer> DifferenceList = new
    ArrayList<Integer> ();      Map<Integer, Integer> map = new
    HashMap<Integer, Integer>();        int index = 0;      int len = 1;        int
    j=1;        Indexlist.add(0);       for(int i = 0; i< string.length() ;i++) {
        if(j< string.length()){
            if(string.charAt(i) < string.charAt(j)){
                len++;
                list.add(len);
            } else{
                index= i+1;
                Indexlist.add(index); //                    System.out.println("\nindex" + index);              
                len=1;              
            }           }           j++;        } //        System.out.println("\nlist" +list);         System.out.println("index List" +Indexlist); //     int n =
    Collections.max(list); //       int ind = Collections.max(Indexlist);
    //      System.out.println("Max number in IndexList  " +n);
    //      System.out.println("Index Max is " +ind);

    //Finding max difference in a list of elements      for(int diff = 0;
    diff< Indexlist.size()-1;diff++){           int difference =
            Indexlist.get(diff+1)-Indexlist.get(diff);
    map.put(Indexlist.get(diff), difference);
    DifferenceList.add(difference);         }
    System.out.println("Difference between indexes" +DifferenceList); //        Iterator<Integer> keySetIterator = map.keySet().iterator(); //      while(keySetIterator.hasNext()){
    //          Integer key = keySetIterator.next();
    //          System.out.println("index: " + key + "\tDifference  "
    +map.get(key)); // //       } //        System.out.println("Diffferenece List" +DifferenceList);        int maxdiff = Collections.max(DifferenceList);      System.out.println("Max diff is " + maxdiff);       //////      Integer
    value = maxdiff;        int key = 0;        keyList.addAll(map.keySet());
    Collections.sort(keyList);      System.out.println("List of al keys"
            +keyList); //       System.out.println(map.entrySet());         for(Map.Entry entry: map.entrySet()){           if(value.equals(entry.getValue())){
    key =  (int) entry.getKey();            }       }       System.out.println("Key value of max difference starting element is " + key);   

    //Iterating key list and finding next key value         int next = 0 ;
    int KeyIndex = 0;       int b;      for(b= 0; b<keyList.size(); b++) {
        if(keyList.get(b)==key){
            KeyIndex = b;           }                       }       System.out.println("index of key\t" +KeyIndex);         int nextIndex = KeyIndex+1;         System.out.println("next Index = " +nextIndex);         next = keyList.get(nextIndex);
            System.out.println("next Index value is = " +next);

            for( int z = KeyIndex; z < next ; z++) {
                System.out.print(string.charAt(z));         }   }

            }

答案 2 :(得分:-1)

2048x2048是IOS8 safari上的最大纹理尺寸,或者使用具有6x 1024x1024纹理的天空盒的全景img 2048x1024在分辨率和性能方面将是更好的解决方案