V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
V2EX 提问指南
sunboy911
V2EX  ›  问与答

求思路:图片上要加个测量功能,可以任意图片上选取两点,然后测量这两点间的距离

  •  
  •   sunboy911 · 2017-10-31 09:56:29 +08:00 · 4873 次点击
    这是一个创建于 2579 天前的主题,其中的信息可能已经有所发展或是发生改变。

    如题。有木有大神用 js 实现过类似的功能,拜托了。

    38 条回复    2018-05-11 16:29:26 +08:00
    jlsk
        1
    jlsk  
       2017-10-31 09:59:20 +08:00
    没上过高中?
    sxm
        2
    sxm  
       2017-10-31 10:08:21 +08:00 via Android
    先判断 2 点是否为斜线,斜线的话那就套用公式计算直角三角形的斜边长度
    sunboy911
        3
    sunboy911  
    OP
       2017-10-31 10:12:23 +08:00
    不是问直线咋算,是代码具体咋实现的
    mooncakejs
        4
    mooncakejs  
       2017-10-31 10:14:38 +08:00
    最基础的勾股定理还要啥代码?
    CEBBCAT
        5
    CEBBCAT  
       2017-10-31 10:16:10 +08:00 via Android   ❤️ 1
    选两点的时候可以拿到坐标,把坐标做勾股运算就好了
    coderluan
        6
    coderluan  
       2017-10-31 10:16:44 +08:00
    首先用 getMousePos 之类的函数获取两点的坐标( ax,ay ),( bx,by )
    然后距离就等于 开方(( ax-bx )( ax-bx )+( ay-by )( ay-by ))

    @sxm #3 那公式也也适用斜线的,不用判断。

    PS:虽然我知道这个政治不正确,但是我还是忍不住怀疑楼主是不是培训班出身......
    jiangzhuo
        7
    jiangzhuo  
       2017-10-31 10:27:28 +08:00
    alert('出门左转得力文具淘宝旗舰店')
    holystrike
        8
    holystrike  
       2017-10-31 10:43:01 +08:00
    @jlsk 勾股定理是初中
    m939594960
        9
    m939594960  
       2017-10-31 10:45:59 +08:00
    楼主要的只是这么单纯的功能啊。。。我还以为是那种实景点两个点自动测距离呢
    xomix
        10
    xomix  
       2017-10-31 10:51:28 +08:00
    @coderluan 亮点斜线公式,还可以求斜率……话说我当年也突然想不起来过
    jlsk
        11
    jlsk  
       2017-10-31 10:58:21 +08:00
    @holystrike
    说勾股定理的都没上过高中!

    这是平面解析几何的内容,高二的那个小薄本
    平面上两点间的距离公式跟勾股定理有个屁关系!
    勾股定理只不过是特例中的特例
    连 TM 基本三角函数都不懂,就会个小学生现推理也能推出来的勾股定理
    给定直线 AB 的长度和倾斜角勾股定理能 tm 反推点坐标吗?
    给你极坐标的两点 P1P2 你用勾股定理给我算算距离?

    对于这个站的文化水平之低感到惊讶!
    kokdemo
        12
    kokdemo  
       2017-10-31 11:08:04 +08:00
    @jlsk 戾气也太大了,嘴能放干净点么
    jlsk
        13
    jlsk  
       2017-10-31 11:12:14 +08:00
    @kokdemo 放你妈了隔壁,傻逼
    你那只狗眼看到老子嘴不干净了?
    sunboy911
        14
    sunboy911  
    OP
       2017-10-31 11:13:44 +08:00
    @coderluan 话说 js 咋操作图片呀,在图片上选两个点 然后给其连上线,然后线上给其距离显示出来
    imn1
        15
    imn1  
       2017-10-31 11:13:46 +08:00
    @jlsk
    虽然确实是平面解析几何,也应该用它来解
    但并非知道两点坐标不能用勾股定理来解吧?
    liuminghao233
        16
    liuminghao233  
       2017-10-31 11:15:58 +08:00 via iPhone
    游标卡尺比较准
    sunboy911
        17
    sunboy911  
    OP
       2017-10-31 11:16:06 +08:00
    不知道这操作图片的 js 咋写呀 选点和连线
    jlsk
        18
    jlsk  
       2017-10-31 11:23:05 +08:00
    @imn1 如果是正交平面那是能解
    本来我也不想说啥,看到他强调初中我才多说两句

    但是就 lz 这个问题不一定坐标系是正交平面啊
    如果那图是用在一些特定场合的坐标系下呢?
    hxndg
        19
    hxndg  
       2017-10-31 11:28:55 +08:00
    @jlsk
    不太明白你在表达什么,虽然平面上两点距离公式不等于勾股定理,但是讲解的时候还是以勾股定理作为依托,
    当然确实得承认V站的部分程序员解析几何的东西不是很了解,至于极坐标系就是另外的问题了,当然我也记得不清楚了.

    PS  你下面的回复太脏了,兄弟.
    kokdemo
        20
    kokdemo  
       2017-10-31 11:38:23 +08:00
    cc @Livid

    @jlsk 这位已经开始人身攻击和辱骂了。
    takanasi
        21
    takanasi  
       2017-10-31 11:45:02 +08:00 via Android
    lz 内心是崩溃的,他只是想知道怎么做特效
    coderluan
        22
    coderluan  
       2017-10-31 11:54:51 +08:00
    @sunboy911 #15

    也就是说其实你是连 js 都不懂呗,你也不是求思路,是想要代码......
    这样可以不好...

    https://gist.github.com/LuanZhanKuangGe/e0714d39301eb884e2ac35c0f0af20ea
    coderluan
        23
    coderluan  
       2017-10-31 11:57:34 +08:00
    @jlsk #12 文化水平低总好过素质低。
    1oNflow
        24
    1oNflow  
       2017-10-31 12:07:23 +08:00 via iPhone
    我以为要通过图片估算三维空间中两个物体的距离……
    icyalala
        25
    icyalala  
       2017-10-31 12:33:03 +08:00
    楼主应该只是 JS 不行,想要求个 JS Demo 吧。。。

    @jlsk 14 楼回复很不干净。
    wxt
        26
    wxt  
       2017-10-31 12:41:11 +08:00 via Android
    google map api v3 离线版本,离线地图,把图片切成地图碎片,还能放大缩小,获取到坐标,计算距离。
    回复不要太脏!
    Livid
        27
    Livid  
    MOD
       2017-10-31 12:46:27 +08:00   ❤️ 1
    @kokdemo 举报收到。这个账号已经彻底 ban。
    wangxiaoer
        28
    wangxiaoer  
       2017-10-31 12:49:52 +08:00
    找个轻量级的地图库比如 leafletjs 之类,直接加载图片,有测距功能。
    Mithril
        29
    Mithril  
       2017-10-31 13:11:30 +08:00
    简单的欧几里得距离上面的公式就能算。
    实际上勾股定理也能算
    但想要知道图像中物体的实际距离就不可能了,除非对图像内容进行限制。
    Shura
        30
    Shura  
       2017-10-31 13:18:05 +08:00 via Android
    我想到了昨天那个“高数”的帖子,这明显的是求两点间距离(欧几里德距离),关勾股定理什么事?
    YingJie
        31
    YingJie  
       2017-10-31 13:18:39 +08:00 via Android   ❤️ 1
    YingJie
        32
    YingJie  
       2017-10-31 13:19:27 +08:00 via Android
    @YingJie 没翻到下面就 @了,不好意思,撤回。
    sunboy911
        33
    sunboy911  
    OP
       2017-10-31 13:48:31 +08:00
    @coderluan 受教了
    sunboy911
        34
    sunboy911  
    OP
       2017-10-31 13:48:49 +08:00
    是的求代码哈哈
    magicO
        35
    magicO  
       2017-10-31 14:08:39 +08:00 via Android
    @Livid 好评,净化环境
    wjm2038
        36
    wjm2038  
       2017-10-31 22:00:52 +08:00 via Android
    @Shura 指的应该是 a*a+b*b=c*c,两个点坐标 x 差距和 y 差距就是 a 和 b,勾股定理也没错
    ctt
        37
    ctt  
       2017-11-01 00:03:03 +08:00 via iPhone
    勾股定理也没错,初中生就不会解这个距离差的求法了?没必要死板。
    wmm
        38
    wmm  
       2018-05-11 16:29:26 +08:00
    java 中
    坐标 1:(3,0)
    坐标 1:(0,4)
    float fLen = (float) Math.sqrt(Math.pow((3 - 0), 2) + Math.pow(0 - 4, 2));

    fLen = 5.0
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   2608 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 25ms · UTC 01:54 · PVG 09:54 · LAX 17:54 · JFK 20:54
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.