小编Sph*_*ech的帖子

谷歌地图API JS上的3D地球地球

谷歌地图上,我们现在可以将地球视为3D地球仪.

这是一个例子:

请咨询https://www.google.fr/maps/@18.4980181,7.5767451,3z


我正在使用谷歌地图API开发一个HTML项目,我想在我的网站上使用这个地球表示.

但是,我没有找到关于这个主题的任何话题.

有没有办法用谷歌地图网站 3D 上的歌地图API来表示3D地球地球?


这是我的地图的一个例子(它当然是我的代码的摘录,以澄清问题):

var map;
      function initMap() {
        map = new google.maps.Map(document.getElementById('map'), {
          center: {lat: -34.397, lng: 150.644},
          zoom: 8
        });
      }
Run Code Online (Sandbox Code Playgroud)
      /* Always set the map height explicitly to define the size of the div
       * element that contains the map. */
      #map {
        height: 100%;
      }
      /* Optional: Makes the sample page fill the window. */
      html, body {
        height: 100%;
        margin: 0;
        padding: 0;
      }
Run Code Online (Sandbox Code Playgroud)
    <meta name="viewport" …
Run Code Online (Sandbox Code Playgroud)

javascript google-maps google-maps-api-3

10
推荐指数
1
解决办法
3147
查看次数

使用谷歌地图api 3和js创建样式

所以,我想在我的地图上创建自己的样式.例如,假设我想在国家的范围内放一些鲜花(或其他东西),我该怎么办呢?

我使用谷歌地图的样式,但有一个限制:我们可能使用谷歌提供的不同样式(不透明度,颜色...).如何创建自己的样式?

我的地图使用造型器像造型器,你可以找到在这里对谷歌开发者网站.文档没有描述我的问题,我试图在一些网站中找到一些其他方式,如堆栈溢出,但没有成功.

我将在示例中使用文档的映射以简化示例.所以,这是我的代码:

<!DOCTYPE html>
<html>
  <head>
    <title>Styled Map Types</title>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
    <meta charset="utf-8">
    <style>
      /* Always set the map height explicitly to define the size of the div
       * element that contains the map. */
      #map {
        height: 100%;
      }
      /* Optional: Makes the sample page fill the window. */
      html, body {
        height: 100%;
        margin: 0;
        padding: 0;
      }
    </style>
  </head>
  <body>
    <div id="map"></div>
    <script>
      function initMap() {

        // Create a new StyledMapType …
Run Code Online (Sandbox Code Playgroud)

javascript google-maps google-maps-api-3

7
推荐指数
1
解决办法
205
查看次数

检测实际可用的计算和处理能力浏览器javascript

我正在开发一个包含大量图像和动画的大型网站.我的问题是动画和图像占用了很多可用浏览器的计算和处理能力,有时它可能会饱和而且崩溃.

因此,我想测试浏览器的实际可用计算能力,以便知道何时可以显示动画或加载图像.

在网络中,我找到了Document.readyState方法,但它只给了我一个信息:加载页面时以及外部资源是否已完全加载.但是,浏览器可以绘制动画或加载一些其他外部资源......

我只想知道浏览器是否忙碌以及是否可以为其提供更多工作(如加载图像或显示动画).

在Google Chrome中,我们可以使用控制台执行此操作:

在此输入图像描述

为什么不以编程方式?

注意,我在Stack Overflow中找到了这个答案.我的帖子不是重复的,因为我想找到加载我的图像并显示我的动画的最佳时刻我不能在我的代码中多次使用此测试.

任何帮助表示赞赏.如果您有任何问题或意见,请告诉我.

html javascript browser performance animation

7
推荐指数
1
解决办法
343
查看次数

使用js和谷歌地图api v3(地点库)解析地点照片

我正在开发一个网站,可以显示几个地方的照片。我得到的照片是这样的:

var photos = typeof place.photos !== 'undefined' ? place.photos[0].getUrl({ 'maxWidth': 100, 'maxHeight': 125 }) : '';
if (photos.length) {//...//}
Run Code Online (Sandbox Code Playgroud)

不幸的是,当我想显示照片时,它们的清晰度非常糟糕:

在此输入图像描述

注意:我用w3schools 幻灯片显示照片,并将照片设置如下:

var images = document.getElementById("PhotoFond").getElementsByTagName("img");
for (i=0; i<images.length; i++;) {

    if (!photosSlide[i]) {return;}
    images[n - 1].src = photosSlide[i];

}
Run Code Online (Sandbox Code Playgroud)

然而,当我去谷歌地图并找到同一张照片(链接到同一张照片)时,质量更好。

在此输入图像描述

我怎样才能有相同的分辨率?

javascript google-maps google-maps-api-3

3
推荐指数
1
解决办法
738
查看次数

CSS文本垂直对齐中心不居中

重要:

我的帖子(通常)不重复.我发现这个,这个,这个这个堆栈溢出后(也有可能所有重复).我尝试这个帖子最常见的答案,但它不起作用.我也试过其他方法,但我无法达到目标.

所以,我有一个带文字的大div:

 html, body {
    height: 100%;
}

#dimScreen {
    width: 100%;
    height: 100%;
    background:rgba(0,0,0,0.5);
}

h1 {
    font-size:350%;
}
Run Code Online (Sandbox Code Playgroud)
<div id="dimScreen" style="text-align: center; vertical-align: center; display:inline-block;">
    <h1 >Big text</h1> 
</div>
Run Code Online (Sandbox Code Playgroud)

我的问题是,我无法想象如何将文本放在我的灰色div的中心(垂直+水平).如您所见,文本显示在div的中心(水平),但不在垂直中心.我在身体的一部分设置了中心(垂直+水平).

在我的示例中,我尝试将文本垂直对齐所有这些帖子的最常见响应,但它不起作用.我已经尝试过其他方式,我们可以在链接的问题中找到它们,但它们不起作用:我们总是有相同的结果.

我想我有这个问题,因为我在所有页面上显示我的(灰色)div.我尝试了一个普通的div并且代码有效:我的文本是垂直居中的.

简短的问题:

如何将文本垂直居中于灰色div?

如果您有疑问,请告诉我.

斯芬克斯.

html css css3

1
推荐指数
1
解决办法
1215
查看次数

JS-将 Image 对象转换为 jpeg 文件

所以,我有一个用于上传图片的用户输入。这是一个简单的例子:

function handleImage(e){
    var reader = new FileReader();
    reader.onload = function(event){
        var img = new Image();
        img.onload = function(){
            console.log (img);
        }
        img.src = event.target.result;
    }
    reader.readAsDataURL(e.target.files[0]);     
}
Run Code Online (Sandbox Code Playgroud)
<input type="file" onchange="handleImage(event)"><br>
Run Code Online (Sandbox Code Playgroud)

如您所见,我Image ()console. 我想将其转换Image为 jpg 文件。

我知道如何获取图片的像素,但是将它发送到服务器完全是疯狂的:它太大了!

我还尝试访问存储在计算机中的 jpg 文件,但我没有实现任何目标。

我发现的唯一方法是form像这样发送它:

<form action="anything.php" method="post" enctype="multipart/form-data">
    <input type="file" name="fileToUpload" id="fileToUpload">
</form>   
Run Code Online (Sandbox Code Playgroud)

在 PHP 中:

$_FILES["fileToUpload"]["tmp_name"]
Run Code Online (Sandbox Code Playgroud)

为什么不使用 JS?

我的最终目标是使用 AJAX 发送 jpg 文件。

如果您有任何问题,请告诉我。

javascript image imagejpeg

1
推荐指数
1
解决办法
1万
查看次数