制作闪国家地图 [英] Making a flash country map

问题描述

您好我想使欧洲的闪光地​​图，越过或跳出每一个国家，当你的鼠标会有些事情发生，如改变这个国家的颜色。

Hello I want to make a flash map of Europe where when you mouse over or out of each country something will happen, like changing the color of the country.

请参阅此图片

See this image

如果我翻身挪威和当时的瑞典，瑞典将不会被设置为蓝色，因为挪威的边框是在​​瑞典之上，所以我必须去低一点翻身瑞典，它不与挪威instersect。

If I roll over Norway and then Sweden, Sweden will not be set to blue because Norway's bounding box is on top of Sweden, so I have to go a bit lower to roll over Sweden where it does not instersect with Norway.

有没有更好的方式来实现相同的功能？喜欢使用位图像素。

Is there a better way to achieve the same functionality? Like using Bitmap pixels.

我在PNG格式的所有cointries的精灵表。我嵌入这个精灵表，比创建一个使用copyPixels雪碧AS3类（）从精灵表，以INNET变量的BitmapData复制。

I have a sprite sheet of all cointries in png format. I embed this sprite sheet and than create Sprite AS3 class that uses copyPixels() to copy from the sprite sheet to innet variable BitmapData.

下面是我的课

  public class Country extends Sprite 
  {
    private var newBitmap:Bitmap;
    private var tintColor:Color = new Color();

    public function Country(bitmapData:BitmapData) 
    {
        newBitmap = new Bitmap(bitmapData);

        tintColor.setTint (0x0000ff, 0.6);

        this.useHandCursor = true;
        this.buttonMode = true;

        addEventListener(Event.ADDED_TO_STAGE, init);
    }
    private function init(e:Event):void
    {
        addChild(newBitmap);
        addEventListener(MouseEvent.MOUSE_OVER, onMouseOver);
        addEventListener(MouseEvent.MOUSE_OUT, onMouseOut);
    }

    private function onMouseOver(e:MouseEvent = null):void
    {
        newBitmap.transform.colorTransform = tintColor;
    }

    private function onMouseOut(e:MouseEvent = null):void
    {
        newBitmap.transform.colorTransform = new ColorTransform();
    }
   }

位图数据是在使用运行时copyPixels（）创建像这样

bitmapData is created at runtime using copyPixels() like this

 var countiresArray:Array = Resources.allCointriesJSON["frames"];
 var newX:Number = countiresArray[i]["frame"]["x"];
 var newY:Number = countiresArray[i]["frame"]["y"];
 var newW:Number = countiresArray[i]["frame"]["w"];
 var newH:Number = countiresArray[i]["frame"]["h"];
 bitmapData .copyPixels(Resources.allCountries.bitmapData, new Rectangle(newX, newY, newW, newH), new Point(0, 0));

在这里下一页末，NewY，东西方妇女网络和newH从出口JSON文件采取的是使用TexturePacker时创建

where newX,NewY, newW and newH are taken from exported JSON file that is created when using TexturePacker

推荐答案

无需转换你的国家形象的载体，你将需要检查下鼠标像素的Alpha值，以获得准确的交互。幸运的是，一个人的已经书面和开放源码的，应该做的工作的实用程序： InteractivePNG

Without converting your country images to vectors, you will need to check the alpha values of pixels under the mouse to get accurate interactions. Luckily, someone's already written and open sourced a utility that should do the job: InteractivePNG.

你只需要把你的位图 InteractivePNG 实例，而不是一个雪碧里。

You'll just need to put your bitmaps inside an InteractivePNG instance instead of a Sprite.

这篇关于制作闪国家地图的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！